仅Firebase Hosting部署环境下WebSocket连接失败问题排查

应用此前正常运行，数年前突然出现WebSocket连接失效问题。排查后确认：本地运行、使用firebase serve --only hosting启动服务均正常，仅部署到Firebase Hosting生产环境时连接失败。

相关代码 #

let socket = new WebSocket('wss://api.upbit.com/websocket/v1')

socket.onopen = (e) => {
  console.log('[open] 웹소켓이 열렸습니다');
  socket.send(
    `${JSON.stringify(
      [{ ticket: uuidv4() }, { type: 'ticker', codes: krw.map(c => c.market) }]
    )}`
  )
}

socket.onmessage = async (event) => {
  const ticker = await new Response(event.data).json()
  //...parse response and do something...
}

socket.onclose = (event) => {
  if (event.wasClean) {
    console.log(`[close] 커넥션이 정상적으로 종료되었습니다(code=${event.code} reason=${event.reason})`);
  } else {
    // 예시: 프로세스가 죽거나 네트워크에 장애가 있는 경우
    // event.code가 1006이 됩니다.
    console.warn(`[close] 커넥션이 죽었습니다. ${JSON.stringify(event)}`);
  }
}

socket.onerror = function (error) {
  console.warn(`[error] ${JSON.stringify(error)}`);
}

控制台错误日志 #

index.5eafb082.js:1  WebSocket connection to 'wss://api.upbit.com/websocket/v1' failed: 
openSocket @ index.5eafb082.js:1
index.5eafb082.js:1 [error] {"isTrusted":true}
index.5eafb082.js:1 [close] 커넥션이 죽었습니다. {"isTrusted":true}

错误对象仅包含{ "isTrusted": true }，无有效排查信息。补充原始错误对象的console.error截图：

排查思路与解决方案 #

1. 检查Firebase Hosting的内容安全策略（CSP） #

Firebase Hosting生产环境默认有严格的安全规则，可能是规则更新拦截了WebSocket连接：

• 登录Firebase控制台，进入Hosting > 规则，检查Content-Security-Policy（CSP）配置。
• 确保CSP的connect-src指令允许wss://api.upbit.com，示例配置：

  {
    "hosting": {
      "headers": [
        {
          "source": "**",
          "headers": [
            {
              "key": "Content-Security-Policy",
              "value": "connect-src 'self' wss://api.upbit.com;"
            }
          ]
        }
      ]
    }
  }
  

• 部署更新后的配置：firebase deploy --only hosting

2. 排查CDN/代理层干扰 #

Firebase Hosting依赖CDN服务，可能对WebSocket连接有特殊处理：

• 检查Firebase Hosting是否启用了缓存或加速规则，临时禁用后重新部署测试。
• 验证Upbit的WebSocket端点是否支持CDN转发连接，部分服务商可能拦截CDN节点的IP请求。

3. 查看浏览器网络详情 #

生产环境浏览器安全策略更严格，通过开发者工具获取更多错误信息：

• 打开浏览器Network标签，找到WebSocket连接请求，查看响应状态码、响应头，确认是否有4xx/5xx错误或额外拦截提示。
• 确认生产环境使用HTTPS（Firebase默认强制HTTPS），避免混合内容限制。

4. 验证Upbit API访问限制 #

生产环境IP可能被Upbit的API规则限制：

• 查阅Upbit API文档，确认是否有IP白名单或请求频率限制，检查Firebase生产环境IP段是否在允许范围内。
• 尝试用Firebase Functions作为代理转发WebSocket请求，验证是否是前端直接连接的问题。

5. 升级Firebase相关工具与依赖 #

旧版本工具可能与当前Firebase Hosting不兼容：

• 升级Firebase CLI到最新版本：npm install -g firebase-tools
• 检查项目依赖包版本，更新过时的相关库后重新部署。

内容的提问来源于stack exchange，提问作者Guest-01