React Native中Postman可正常调用API，Axios请求报网络错误

我来帮你一步步排查这个问题，结合你给出的代码和报错信息，核心问题集中在URL格式、CORS配置和Android平台网络权限这几个方面，具体如下：

1. 修复Axios请求的URL协议头 #

你当前的请求URL是13.126.71.152:3000/checkin，缺少了http://协议头。Postman会自动补全协议，但React Native的HTTP客户端不会识别这种无协议的URL，直接导致网络请求失败。

修改后的Axios请求代码：

axios({ 
  method: 'post', 
  url: 'http://13.126.71.152:3000/checkin', // 加上http://协议头
  data: { location, name: naming } 
})
.then((res) => { 
  console.log(res); 
})
.catch((error) => { 
  console.error('请求错误:', error); 
});

2. 完善后端CORS配置 #

你的后端已经引入了cors包，但没有启用，而且手动设置的CORS头里没有允许POST请求方法——这会导致预请求（OPTIONS）失败，进而触发网络错误。

方案一：直接使用cors包（推荐） #

替换你手动写的CORS中间件，直接用cors()即可自动处理所有跨域需求，代码更简洁且不易出错：

var express = require('express');
const app = express();
const cors = require('cors');
const path = require('path');
const port = process.env.PORT || 3000;
const bodyParser = require('body-parser');

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
app.use(express.static(path.join(__dirname, 'public')));

// 替换手动CORS配置为这一行
app.use(cors()); 

var routes = require('./api/routes/MetroRoutes');
routes(app);

app.listen(port);
console.log('metro RESTful API server started on: ' + port);

方案二：手动补充POST方法 #

如果你坚持手动配置CORS，需要把POST和OPTIONS（预请求必需）加入允许的方法列表：

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  // 加入POST和OPTIONS方法
  res.header('Access-Control-Allow-Methods', 'POST, DELETE, PUT, OPTIONS'); 
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept,x-auth");
  res.header('Access-Control-Expose-Headers', 'x-auth');
  // 直接处理OPTIONS预请求，返回200状态
  if (req.method === 'OPTIONS') {
    return res.sendStatus(200);
  }
  next();
});

3. 检查Android平台的网络权限（针对HeadlessJS场景） #

如果你的应用运行在Android平台，还需要确认以下配置：

• 在AndroidManifest.xml中添加网络权限：

  <uses-permission android:name="android.permission.INTERNET" />
  

• 若你的API使用HTTP明文协议（非HTTPS），且设备是Android 9（API 28）及以上，需要在application标签中开启明文流量支持：

  <application
    ...
    android:usesCleartextTraffic="true">
    ...
  </application>
  

最后验证步骤 #

1. 重启后端服务，确保CORS配置生效；
2. 修改React Native代码中的URL，添加http://；
3. 重新打包或刷新RN应用，测试Headless任务中的API调用。

内容的提问来源于stack exchange，提问作者Divye Shah