Question

我有一个使用角度CLI构建的简单Web应用程序。我希望它使用Web套接字与后端通信。我已经编写了后端，并使用服务器可以在套接字上发送和接收的简单index.html页面进行测试。

在我的angular-cli项目中，我设置了一个代理配置文件来设置后端的代理。

proxy.conf.json

{
  "/sock": {
    "target": "http://localhost:3000",
    "changeOrigin": true,
    "ws": true,
    "logLevel": "debug"
  }
}

然后使用以下命令启动服务器。

ng serve --proxy-config proxy.conf.json

现在我有一个服务，只是尝试打开一个套接字并发送一个固定的字符串，我希望看到后端记录。

import { Injectable } from '@angular/core';
import * as io from 'socket.io-client';

@Injectable()
export class ChatService {

  private socket: any;

  constructor() {
    this.socket = io({ 'path': '/sock' });
    this.socket.emit('chat message', 'Hello World from browser!');
   }

}

注意：我已经有过几次使用和没有网址的/ sock部分。

我启动两台服务器。在浏览器中没有控制台错误。但是在角度CLI Web包服务器中，我收到以下消息。

10% building modules 2/2 modules 0 active[HPM] Proxy created: /sock  ->  http://localhost:3000
[HPM] Subscribed to http-proxy events:  [ 'error', 'close' ]

[HPM] GET /sockjs-node/530/z1z3teld/websocket -> http://localhost:3000
[HPM] Upgrading to WebSocket
[HPM] Error occurred while trying to proxy request /sockjs-node/530/z1z3teld/websocket from localhost:4200 to http://localhost:3000 (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)

支持网络套接字还是我犯了一个愚蠢的错误？感谢

Answer 1

我设法通过一些试验和错误弄明白了。我在控制台中查看了在后端项目中工作的基本index.html页面。这个后端项目基本上是socket.io网站上的聊天服务器演示应用程序。我注意到，当它打开Web套接字时，网址如下所示：

parameter

回到角度CLI项目中，我修改了我的代理配置以包含/socket.io/部分加上还添加了通配符。

http://localhost:3000/socket.io/EIO=3&transport=websocket&sid=wTvdQTclHXJSUmAmAAAA

宾果！现在，当构建服务时，它会打开套接字并发出一条消息，我可以看到它在后端登录。

如何使用Web套接字和角度CLI设置代理

1 个答案: