Question

我有一个Angular应用程序，该应用程序与在localhost：3000上运行的Node后端进行通信，并且我想配置一个反向代理，因此对后端的请求为'/ api / user / login'而不是'{{3 }}'。我已经用Google搜索了一下，使用内置的Angular CLI代理功能确实很容易。我的问题是该应用程序还使用socket.io，并且在设置代理后无法设法使其正常工作。我创建了一个包含以下内容的proxy.conf.json文件：

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false,
    "logLevel": "debug",
    "changeOrigin": true,
    "pathRewrite": {
      "^/api": ""
    }
  },
  "/socket.io": {
    "target": "http://localhost:3000",
    "secure": false,
    "changeOrigin": true
  }
}

对后端的请求工作正常，但是我遇到了关于socket.io连接的错误：

WebSocket连接到 'ws：// localhost：4200 / socket.io /？EIO = 3＆transport = websocket＆sid = h592dAWowJvCLxO5AAAC' 失败：WebSocket打开握手超时

我需要进行哪些更改才能使其正常工作？

谢谢！

Answer 1

只是偶然，我在github中发现了这个问题：

https://github.com/angular/angular-cli/issues/6081

正如所说的，有两个选项ws和wss用于代理websocket连接，因此我修改了代理设置文件：

"/socket.io": {
  "target": "http://localhost:3000",
  "secure": false,
  "changeOrigin": true,
  "ws": true
}

现在，一切都与添加代理之前一样。

奇怪的是，我在Angular文档（https://angular.io/guide/build#proxying-to-a-backend-server）中没有找到关于此选项的任何信息。我还检查了webpack网站，以查找其服务器的代理选项，但找不到任何相关内容。我想要列出所有可用选项的清单，有人知道从哪里获得吗？

修改看来Angular将node-http-proxy用于其开发服务器，因此以下是这些选项：

https://github.com/http-party/node-http-proxy#options

干杯

在使用socket.io的Angular应用中处理反向代理

1 个答案: