React Native使用Fetch请求本地ASP.NET服务HTTPS接口失败问题求助

这问题我之前帮朋友处理过类似的，结合你的场景（模拟器Safari能访问但React Native fetch失败），给你几个针对性的排查方向：

1. 替换localhost为电脑局域网IP（最常见原因） #

React Native模拟器里的localhost指向的是模拟器自身的本地服务，不是你电脑上运行的ASP.NET服务器。而Safari在模拟器里访问localhost时，其实是代理到了电脑的localhost，所以能成功。

解决方法：

• 找到你电脑的局域网IP：
  • Windows：打开命令提示符，执行ipconfig，找到「无线局域网适配器 WLAN」或「以太网适配器」下的IPv4 地址
  • Mac：打开终端，执行ifconfig，找到en0或en1下的inet地址
• 把fetch的URL替换成你的IP地址，比如：

  const response = await fetch(`https://192.168.1.100:2318/api/Restaurant`)
  

• 另外安卓模拟器可以用特殊地址10.0.2.2直接映射电脑的localhost，iOS模拟器也可以试试localhost但如果不行还是用IP更稳妥。

2. 处理HTTPS自签名证书信任问题 #

本地ASP.NET的HTTPS证书是自签名的，React Native的网络请求默认不信任这类证书，而Safari里你可能已经手动信任过该证书，所以能正常访问。

解决方法二选一：

• 临时切换到HTTP（开发环境推荐）：
  打开ASP.NET项目的Properties/launchSettings.json，找到对应的启动配置，把applicationUrl改为HTTP地址（比如http://localhost:2318），重启服务器后，fetch改用HTTP请求：

  const response = await fetch(`http://192.168.1.100:2318/api/Restaurant`)
  

• 信任自签名证书：
  • iOS模拟器：将ASP.NET的证书文件（通常在~/.aspnet/https/目录下，后缀为.pfx或.cer）拖到模拟器中，然后进入「设置」→「通用」→「VPN与设备管理」，找到该证书并信任。
  • 安卓模拟器：需要将证书转换为PEM格式，放到项目的android/app/src/main/res/raw目录，然后通过代码配置信任（步骤稍复杂，开发环境更推荐用HTTP）。

3. 检查ASP.NET的CORS配置 #

虽然React Native的fetch不严格遵循浏览器的CORS规则，但如果ASP.NET服务器的CORS配置过于严格，也可能导致请求失败。

确认你的ASP.NET项目已正确配置CORS：

• 在Startup.cs（.NET 5及以前）或Program.cs（.NET 6+）中添加CORS中间件：

  // .NET 6+ 示例
  builder.Services.AddCors(options =>
  {
      options.AddPolicy("AllowAll", policy =>
      {
          policy.AllowAnyOrigin()
                .AllowAnyMethod()
                .AllowAnyHeader();
      });
  });
  
  app.UseCors("AllowAll");
  

• 确保UseCors中间件在UseRouting和UseEndpoints之前（.NET 5及以前），或者在MapControllers之前（.NET 6+）。

4. 排查防火墙与端口占用 #

• 确认电脑防火墙允许2318端口的入站请求，虽然Safari能访问，但部分防火墙可能对非浏览器的网络请求做了限制。
• 检查2318端口是否被其他程序占用，执行netstat -ano | findstr :2318（Windows）或lsof -i :2318（Mac），确认只有你的ASP.NET服务器在使用该端口。

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