jbssm
jbssm

Reputation: 7161

Response from HTTP with GET method with params using axios in React Native

I think this might be a very simple question but I'm new to Web requests and can get it working nor get a simple response searching the web

I have a site from which I can get a JSON response by putting this URL into the browser: http://www.test.com/callservice.php?action=stop&x=1&y=2&ct=100

This in turn gives me some JSON response.

Now, I'm trying to get the same in Javascript using Axios.

Either using the URL directly

 componentWillMount() {
    axios.get('http://www.test.com/callservice.php?action=stop&x=1&y=2&ct=100')
      .then(response => console.log(response));
  }

Or by using the GET params:

 componentWillMount() {
    axios.get('http://www.test.com/callservice.php', {
      params: {
        action: 'stop',
        x: 1,
        y: 2,
        ct=100
      }
    })
      .then(response => console.log(response));
  }

But both approaches give the same error:

Possible Unhandled Promise Rejection (id: 0):
Network Error
Error: Network Error

And a more detailed error from catching:

Error: Network Error
    at createError (createError.js:15)
    at XMLHttpRequest.handleError (xhr.js:87)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:542)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:378)
    at XMLHttpRequest.js:482
    at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
    at MessageQueue.__callFunction (MessageQueue.js:236)
    at MessageQueue.js:108
    at guard (MessageQueue.js:46)

Upvotes: 2

Views: 1672

Answers (2)

Tolga Cagin
Tolga Cagin

Reputation: 11

jbssm, It seems you are working on IOS. Can you check your App Transport Security Settings in Project Setings with Xcode.

Xcode disable http connection as default only allows secure connection. You should add "Allow Arbitary Loads" to your Project Settings

Upvotes: 1

Diogo Sgrillo
Diogo Sgrillo

Reputation: 2701

It seems to be a CORS issue.

If you are the owner of the script (on the server), you can add the appropriated response header for handling this issue. In PHP would be something like this:

<?php header("Access-Control-Allow-Origin: *");

For testing purposes (or if you don't have access to the server), you can install a chrome extension which disables the cross-domain restrictions.

Upvotes: 0

Related Questions