React Native: fetch request failed with error - TypeError: Network request failed(…)

问题:

I am developing a simple app using React Native. I am testing it on Android device. I have created a Node.js server to listen to the requests, it is running at http://localhost:3333/. Next, I am making a fetch request from index.android.js. Below is the code.

fetch('http://localhost:3333/',          {             'method': 'GET',             'headers': {                 'Accept': 'text/plain',                                                  }         }            )  .then((response) => response.text())  .then((responseText) => {     console.log(responseText);   })  .catch((error) => {     console.warn(error); });  

The code for the request handler at node server is below

app.use(function(req, res, next) {   res.header("Access-Control-Allow-Origin", "*");   res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");   next(); });  app.use(express.static('public')); app.get('/', function(req, res){      console.log('Request received for /');     res.send("this is the response from the server");     res.end(); }); 

But, the fetch request is not working. The error I get in the Chrome console is: TypeError: Network request failed(…).

How to make this work?

回答1:

Since your Android device has an IP of its own, you need to point the URL to your computers IP address instead of just localhost. For example fetch('http://192.168.0.2:3333/').

回答2:

Use the reverse command of the Android Debug Bridge tool (adb):

adb reverse  - reverse socket connections.                                reverse specs are one of:                                  tcp:                                  localabstract:                                  localreserved:                                  localfilesystem:

For example:

adb reverse tcp:3333 tcp:3333 

This makes localhost:3333 accessible from your device. You can also use different ports. For example:

adb reverse tcp:8081 tcp:3333 

This will redirect the device port 8081 to the service port 3333.

文章来源: React Native: fetch request failed with error - TypeError: Network request failed(…)