使用SignalR-ReactNativeClient库在React Native中建立连接报错如何解决？

从错误日志可定位核心问题：协商请求 https://signalrdemo.com/chatHub/negotiate?negotiateVersion=1 发送后返回 HTTP 0 空错误，无有效响应，直接导致 HubConnection 启动失败。

1 基础网络层排查 #

• 先用开发设备的浏览器直接访问协商地址 https://signalrdemo.com/chatHub/negotiate?negotiateVersion=1，如果无法正常返回JSON格式的协商结果，先排查服务端是否正常运行、域名解析是否正确、服务器防火墙是否放行对应端口。
• 确认应用网络权限已开通：Android端需要在AndroidManifest.xml中添加<uses-permission android:name="android.permission.INTERNET" />权限；iOS端需要在Info.plist中配置HTTPS请求规则，若服务端使用自签名证书，需要额外配置系统信任规则。
• 若使用模拟器调试且服务端为本地部署，不要使用localhost/127.0.0.1作为服务端地址，需要替换为开发机的局域网IP，否则请求会指向模拟器本身而非开发机的服务端。

2 SignalR 配置排查 #

• 检查服务端CORS配置：SignalR服务端必须配置允许客户端来源的跨域规则，同时放行GET/POST请求方法、Upgrade/Connection等请求头，且开启AllowCredentials配置。
• 优先指定WebSockets传输协议，避免其他传输方式的兼容性问题，配置示例如下：

const connection = new HubConnectionBuilder()
  .withUrl('https://signalrdemo.com/chatHub', {
    // 仅使用WebSockets传输，兼容React Native环境
    transport: HttpTransportType.WebSockets,
    // 若服务端仅开启WebSockets协议，可开启该配置跳过协商步骤，减少请求失败概率
    skipNegotiation: true
  })
  .build();

• 确认已安装必要的polyfill：React Native环境默认缺少EventSource等Web API的实现，需要手动安装对应polyfill并在入口文件全局导入。

3 错误详情排查 #

当前日志仅返回通用错误，可修改catch逻辑打印完整错误信息，定位根因：

connection.start()
  .then(() => console.log("连接成功"))
  .catch(err => {
    console.log("完整错误对象：", JSON.stringify(err, null, 2));
    console.log("错误消息：", err.message);
    console.log("错误堆栈：", err.stack);
    if(err.response) {
      console.log("响应状态码：", err.response.status);
      console.log("响应内容：", err.response.data);
    }
  });

也可以通过Charles/Fiddler抓包客户端请求，直接查看协商请求的实际发送情况和返回内容。

常见问题解决方案 #

• CORS错误：修改服务端CORS配置，匹配客户端来源，开启凭证支持
• 自签名证书不被信任：开发环境可临时配置客户端忽略证书校验，生产环境建议使用权威CA签名证书
• 版本不兼容：确认客户端SignalR版本与服务端版本匹配，调整negotiateVersion参数为服务端支持的版本

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