1

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: EDIT: i use cors middleware now:

  app.use(cors());

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?

EasternDude
  • 413
  • 4
  • 16
  • 1
    have you tried `url: 'localhost:3000/tweets'` rather than `url: 'http://127.0.0.1:3000/tweets'`? Also post your express route code for the same – Mahesh Singh Chouhan May 20 '17 at 21:12
  • yes, with no success. without the 'http://' I get this when running on a browser: error:SecurityError: Failed to execute 'open' on 'XMLHttpRequest': Refused to connect to 'localhost:3000/tweets' because it violates the document's Content Security Policy. and running on android emualtor produces: jquery-3.2.1.min.js:4 POST localhost:3000/tweets 404 (Not Found) – EasternDude May 20 '17 at 21:23
  • install cors module of expressjs to allow cross domain request properly, you can follow [this](http://stackoverflow.com/questions/7067966/how-to-allow-cors#37845319) – Mahesh Singh Chouhan May 20 '17 at 21:26
  • well, at least I learned about cors middleware. That did not help at all though. I don't think the problem is on the server-side it must be incorrect codorva configuration but after hours of reading I can't determine whats wrong:/ – EasternDude May 20 '17 at 21:37

1 Answers1

11

Okay, after frustrating hours of research I finally found that localhost or 127.0.0.1 refers just to emulator it self but not the computer it runs on. To fix this problem I just had to send the request to my computers (on which node.js server runs on) local ip. In my case local ip was 192.168.0.2 so I changed:

http://127.0.0.1:3000/tweets 

to:

http://192.168.0.2:3000/tweets

And it seems to work now.

EasternDude
  • 413
  • 4
  • 16