0

When I use axios in react-native, the response of axios is an Network Error. Following is an example of my code.

axios.get('http://localhost:3000');

It is so simple but it makes error. When I receive the error message and deep down, I found a message like

_response: Failed to connect to 'localhost/127.0.0.1:3000'

So I changed the url with

axios.get('http://127.0.0.1:3000');

But the result is just little different and has same error, like

_response: Failed to connect to ‘/127.0.0.1:3000’

When I try the same axios request in web environment, there is no error. And even if there is an error, the error message is occurred as response.

But in react native, the request does not get to the server. As error said, the connection is really not connected.

Is there any way to fix it. Or can I get any example of using axios in react-native? thank you. I attatch the detail error message.

ps. I’m trying to use graphql with axios. Is it fine to use axios for graphql in react-native?

{
  Error: Network Error
      at createError (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:120786:17)
      at XMLHttpRequest.handleError (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:120615:16)
      at XMLHttpRequest.dispatchEvent (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:48127:27)
      at XMLHttpRequest.setReadyState (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:46461:20)
      at XMLHttpRequest.__didCompleteResponse (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:46288:16)
      at blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:46398:47
      at RCTDeviceEventEmitter.emit (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:15671:37)
      at MessageQueue.__callFunction (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:15296:44)
      at blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:15038:17
      at MessageQueue.__guard (blob:http://localhost:8081/d43b10b6-9463-4edf-b6aa-763156e7039f:15250:13)
  ,
  config: {
    url: "http://localhost:3000",
    method: "get",
    headers: {
      Accept: "application/json, text/plain, */*"
    }
  },
  isAxiosError: true,
  request: XMLHttpRequest{
    ...
    _response: "Failed to connect to localhost/127.0.0.1:3000"
    url: "http://localhost:3000"
  },
  response: undefined,
  message: "Network Error"
}
wallah
  • 1,964
  • 5
  • 27
  • 48
  • 1
    Possibly because your quotes are not code quote marks? That is, they are something from Word and not proper code? (I can't remember the name of the formed quotes.) – Rob Oct 22 '19 at 13:13
  • 1
    Have you checked if it is a problem with SSL encryption? – André Pinto Oct 22 '19 at 13:19
  • @Rob I'm off today, so I write it using IPad. I write the code with ‘code quote’, but I’ll check. – wallah Oct 22 '19 at 13:53
  • @AndréPinto no, it is not SSL... – wallah Oct 22 '19 at 13:54
  • Additionally, I use VPN for development environment, so I install VPN cert in the android device and connect to it. Then I can access to the server. And if you can not install the VPN in your device, set your request url with the url of VPN which is set in the your development environment. For example, even if you use the VPN IP `*.*.*.20` when you request for test(eg. in Postman), the VPN IP can be `*.*.*.5` in your local environment. Check that VPN IP in network setting. – wallah Oct 23 '19 at 01:40

0 Answers0