Cordova Android应用中localhost本地Fetch请求无法正常工作的解决方法咨询

嗨，太懂你这种明明API本身没问题、生产环境也能正常跑，偏偏Cordova里本地Fetch就报错的郁闷了！先帮你理清楚当前的问题细节，再给你几个大概率能解决的实用方向：

你现在的请求代码是这样的：

const response = await fetch('http://localhost:3000/poc3/convert', {
  method: 'POST',
  body: formData,
  headers: { 'Accept': 'audio/mpeg' },
});

收到的报错是：

Error: TypeError: Failed to fetch

首先得敲个重点：Cordova应用里的localhost和你电脑上的localhost根本不是一回事！ 不管你用的是Android模拟器还是真机，设备自身的localhost指向的是设备自己，而不是你运行API服务的那台电脑——这是绝大多数人踩的第一个坑。

接下来试试这几个解决办法：

• 换成电脑的局域网IP地址：先查你电脑在当前WiFi下的局域网IP（Windows用ipconfig，Mac/Linux用ifconfig），比如查到是192.168.2.15，就把请求地址改成http://192.168.2.15:3000/poc3/convert，注意要保证手机和电脑在同一个WiFi网络里，同时别让电脑防火墙挡住3000端口的入站请求。
• Android模拟器专属回环地址：如果你用的是Android Studio自带的模拟器，可以直接用10.0.2.2这个内置地址，它会自动映射到你电脑的localhost，把请求改成http://10.0.2.2:3000/poc3/convert就行，不用查IP更省心。
• 检查CSP内容安全策略配置：打开www目录下的index.html，找到CSP的meta标签，要确保允许访问目标地址，比如在connect-src里加上你的局域网IP或者10.0.2.2，示例：

  <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; connect-src 'self' http://192.168.2.15:3000">
  

• 确认Cordova白名单设置：在config.xml里添加允许导航到目标地址的规则，比如：

  <!-- 允许所有3000端口的请求，或者写更具体的地址更安全 -->
  <allow-navigation href="http://*:3000/*" />
  

你说生产URL能正常工作，说明Fetch本身的逻辑没问题，大概率就是本地地址映射不对、或者被CSP/白名单拦截了，先从这几个方向排查，应该能解决这个报错。

备注：内容来源于stack exchange，提问作者Digital Rogue Yeoman