React Native Expo项目调用Axios出现[AxiosError: Network Error]问题求助

针对你用Expo Router + MongoDB开发时遇到的Axios网络错误，按以下步骤逐一排查：

1. 确认Expo的网络访问方式 #

• 若使用Android模拟器，10.0.2.2是正确的本地代理IP；若为真机测试，必须使用电脑的局域网IP（如192.168.x.x），且手机与电脑需连接同一WiFi。
• 尝试以隧道模式启动Expo：expo start --tunnel，该模式可绕过局域网限制，适配跨设备测试场景。

2. 检查防火墙与端口占用 #

• 暂时关闭电脑防火墙，测试是否能正常连接后端服务。
• 验证8000端口是否被后端独占：
  • Windows：执行netstat -ano | findstr :8000，确认PID对应你的Node.js进程。
  • Mac/Linux：执行lsof -i :8000，检查进程是否为你的后端服务。

3. 优化CORS配置 #

尽管你已启用CORS，但默认配置可能存在限制，修改后端代码的CORS设置：

// 替换原有的app.use(cors())
app.use(cors({
  origin: '*', // 测试阶段允许所有来源
  methods: ['GET', 'POST'],
  allowedHeaders: ['Content-Type']
}))

4. 修正请求数据的字段错误 #

前端提交的数据存在字段名不匹配问题：

• 前端代码中提交的是joiningData: joiningDate
• 后端接口接收的是joiningDate
  该错误会导致后端无法正确获取入职日期，即使网络连通也可能保存失败，修改前端的employeeData：

const employeeData = {
  employeeName: name,
  employeeId: employeeId,
  designation: designation,
  phoneNumber: mobileNo,
  dateOfBirth: dob,
  joiningDate: joiningDate, // 修正字段名为joiningDate
  activeEmployee: true,
  salary: salary,
  address: address
}

5. 验证后端是否收到请求 #

在后端的/addEmployee接口开头添加日志，确认请求是否到达：

app.post('/addEmployee', async (req, res) => {
  console.log('收到请求，请求体：', req.body); // 添加日志
  try {
    // 原有代码...
  } catch (error) {
    // 原有代码...
  }
})

若控制台未打印日志，说明网络请求未到达后端，回到前几步排查网络连接；若有日志，说明网络正常，问题出在数据处理或数据库操作。

6. 测试基础网络连通性 #

用Postman或curl直接调用后端接口http://localhost:8000/addEmployee，传入测试数据：

curl -X POST http://localhost:8000/addEmployee \
  -H "Content-Type: application/json" \
  -d '{
    "employeeName": "Test",
    "employeeId": "E001",
    "designation": "Developer",
    "phoneNumber": "1234567890",
    "dateOfBirth": "1990-01-01",
    "joiningDate": "2024-01-01",
    "activeEmployee": true,
    "salary": 5000,
    "address": "Test Address"
  }'

若Postman能成功请求，说明后端服务正常，问题出在Expo的网络配置；若Postman也失败，检查后端服务是否正常启动、MongoDB连接是否真的正常。

内容的提问来源于stack exchange，提问作者Advait Singh