Cristian Flórez
Cristian Flórez

Reputation: 2781

Apollo client / React native error using localhost

I have a react native app that works with Apollo client(grapqhl), the problem is that I have a production API and Apollo client works without any problem but if I change the uri in apollo configuration to localhost:8000/graphql, my IDE console thrown the following error:

[Unhandled promise rejection: Error: Network request failed]
at http://192.166.0.14:19000/node_modules%5Cexpo%5CAppEntry.bundle
?platform=android&dev=true&hot=false&minify=false:358011:25 in new
 ApolloError
at node_modules\@apollo\client\core\core.cjs.js:1081:45 in self.ge
tObservableFromLink.subscribe$argument_0.error
at node_modules\zen-observable\lib\Observable.js:139:8 in notifySu
bscription
at http://192.168.0.14:19000/node_modules%5Cexpo%5CAppEntry.bundle
?platform=android&dev=true&hot=false&minify=false:356825:4 in onNo
tify
at node_modules\zen-observable\lib\Observable.js:239:4 in <anonymo
us>
at node_modules\@apollo\client\utilities\utilities.cjs.js:946:24 i
n iterateObserversSafely
at <anonymous>:null in Array.forEach
at node_modules\@apollo\client\utilities\utilities.cjs.js:945:4 in
 iterateObserversSafely
at http://192.168.0.14:19000/node_modules%5Cexpo%5CAppEntry.bundle
?platform=android&dev=true&hot=false&minify=false:339027:12 in Obj
ect.error
at node_modules\zen-observable\lib\Observable.js:139:8 in notifySu
bscription

I have been able to review some questions to similar problems but I have found two things:

  1. Questions to similar problems are really old and some things have changed, and more with the release of apollo 3
  2. The solutions they suggest have not worked such as changing the localhost to the IP of my machine.
  3. I'm running react native with expo, I have tried running the application in expo go and android studio without any good results.

Apollo client configuration

import { ApolloClient, InMemoryCache } from '@apollo/client';

const client = new ApolloClient({
  uri: 'http://localhost:8000/graphql/',
  cache: new InMemoryCache()
});

Environment information

"@apollo/client": "^3.3.11"
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz"
"expo": "~40.0.0"

windows 10

Upvotes: 2

Views: 1287

Answers (2)

Dhairya Tripathi
Dhairya Tripathi

Reputation: 312

Hey I had similar issues. What I did was replaced local host with my development device ip address (eg. http://192.168.xx.xx:4000/graphql instead of http://localhost:4000/graphql). This was because I was using expo qr scan to run the app on my android device and there was no tunneling over wifi.

Upvotes: 2

William Schlegel
William Schlegel

Reputation: 1

I think that localhost is not defined in your device (emulated or not) and you should use the IP address or the name of your server I had the same problem and solved it this way

Upvotes: 0

Related Questions