I've got an node.js (express) webapp running on localhost:3000. I am now trying to develop a mobile app using cordova.
I've got a route defined in my express app 'localhost:3000/tweets' which when called gets some tweets using twitter API and send them back as json object. Everythinngs works very fine using web app however I am struggling to make the same ajax call from a mobile app. To allow requests from other hosts I've added this to my edxpress app.js:
app.use(function(req, res, next) {
res.header('Access-Control-Allow-Origin', "*");
res.header('Access-Control-Allow-Methods','GET,PUT,POST,DELETE');
res.header('Access-Control-Allow-Headers', 'Content-Type'); next();
});
(I'm not sure thats the correct way to allow conenctions from others hots but that seem to work)
In my cordova app:
meta tag:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="<id...>" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>appname</name>
<description>
A twitter search app.
</description>
<author email="dev@cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<access origin="*" />
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<engine name="android" spec="^6.2.3" />
<plugin name="cordova-plugin-camera" spec="^2.4.1" />
<plugin name="cordova-plugin-whitelist" spec="^1.3.2" />
</widget>
In the index.html file i link 'querySender.js' file at the bottom of body:
<script type="text/javascript" src="js/querySender.js"></script>
And finally, content of 'querySedner.js'
$(document).ready(function(){
$('#btn_send').on('click', function(){
console.log("app is now sending query!");
$.ajax({
type: 'POST',
url: 'http://127.0.0.1:3000/tweets',
data: {name:"test_name",lastname:"last_name"},
dataType:'json',
success: function(dataR){
var date = new Date();
console.log("POST success recorded at: ",date.getTime());
if (!dataR){
console.log("No Data received");
}else{
console.log("DataR: ",dataR);
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log("Status: " + textStatus+" error:"+ errorThrown);
},
timeout:5000
});
});
});
using WebStrom IDE i tried to run index.html in chrome (it runs it on localhost:63342) the request succeeds and data is delivered as expected.
however is emulate the app using android emulator when i press the button i get:
POST http://127.0.0.1:3000/tweets net::ERR_CONNECTION_REFUSED -- jquery-3.2.1.min.js:4
Basically. I'm running my node.js(express) server locally and would like to make ajax calls to it from cordova app on android emulator. What did I get wrong?
via EasternDude
No comments:
Post a Comment