Question

我是Golang，Angular（7.1.4）和websocket的新手。我严格遵循此tutorial来学习它们，并且一切都按预期运行。但是，我不了解Angular如何在localhost：4200 / *提供聊天室页面，其中*可以是我键入的任何内容。

编辑：我的主要问题是，考虑到我唯一影响URL的唯一地方似乎是Angular项目中socket.service.ts的this.socket = new WebSocket("ws://localhost:12345/ws")行，这是怎么发生的。我认为这意味着该页面应该仅在本地主机上加载，如果有的话。

我阅读了一些Angular的文档，最接近答案的是它在routing的页面上，上面写着“最后一条路径中的**路径是通配符。路由器将如果请求的URL与配置中先前定义的路由的任何路径都不匹配，请选择此路由。”但是我没有在任何地方使用**。实际上，在本教程之后我根本没有使用路由。

这是完整的socket.service.ts文件：

import { Injectable } from "@angular/core";
import { EventEmitter } from "@angular/core";

@Injectable({
  providedIn: "root"
})
export class SocketService {
  private socket: WebSocket;
  private listener: EventEmitter<any> = new EventEmitter();

  public constructor() {

    # I think only this line is used to manage the URL.
    this.socket = new WebSocket("ws://localhost:12345/ws");
    this.socket.onopen = event => {
      this.listener.emit({ type: "open", data: event });
    };
    this.socket.onclose = event => {
      this.listener.emit({ type: "close", data: event });
    };
    this.socket.onmessage = event => {
      this.listener.emit({ type: "message", data: JSON.parse(event.data) });
    };
  }

  public send(data: string) {
    this.socket.send(data);
  }

  public close() {
    this.socket.close();
  }

  public getEventListener() {
    return this.listener;
  }
}

在Golang的main.go中，只有两行（主要是http.HandleFunc("/ws", wsPage)）与聊天室URL相关。基于此，我认为该页面也可以在localhost：12345 / ws上加载。但是去那里会产生“找不到错误的请求404页面”。这是我认为与main.go相关的代码：

func wsPage(res http.ResponseWriter, req *http.Request) {
    conn, error := (&websocket.Upgrader{CheckOrigin: func(r *http.Request) bool { return true }}).Upgrade(res, req, nil)
    if error != nil {
        http.NotFound(res, req)
        return
    }
    client := &Client{id: uuid.NewV4().String(), socket: conn, send: make(chan []byte)}
    manager.register <- client

    go client.read()
    go client.write()
}

func main() {
    go manager.start()

    # Only these two lines relate to the URL.
    http.HandleFunc("/ws", wsPage)
    http.ListenAndServe(":12345", nil)
}

有人可以解释一下Angular在这种情况下如何管理URL，以及它的URL优先于Golang的URL吗？或为我指出正确的文档/阅读材料？谢谢。

Answer 1

Websocket是通过在您的浏览器中运行的代码打开的，而不是直接从浏览器中打开的（即，将返回文件，html文档等的网址）。< / p>

这里要注意的另一个关键是协议：

"ws://localhost:12345/ws"

ws://是Angular代码用于与服务器通信的websocket协议。您无法直接使用浏览器的URL栏访问websocket，因为它不知道如何自行处理websocket连接（例如，仅http或https这样的连接）。

Web套接字由Go应用程序“提供”，而Angular应用程序由Node（如果您使用ng serve在本地运行）或通过静态托管环境（例如AWS或Google Cloud）。当您访问在其中提供Angular应用程序的URL时，Angular代码将下载到您的浏览器，并且路由系统将进行控制。如前所述，在默认的Angular应用程序中，存在通配符路由，该通配符路由会将所有路径（主机名后面的内容和斜杠后面的端口）定向到根组件（通常是主AppComponent）

您可以设置具有不同路径和许多路由的不同路由方案，但是，您必须进行一些研究才能发现对您的应用程序/设计有效的方法。您可以看看here for more info。

TL; DR

您需要将这两个程序的概念区分开来：一个是在浏览器中运行的Angular App，另一个是在服务器（或本地计算机）上运行的Go App。因此，您引用本地计算机上两个不同端口的原因是：12345端口是Golang聊天服务器接受传入连接（通过ws:// websocket协议）的位置，而{{1} }端口是Node.js侦听传入连接以服务Angular HTML / CSS / JS包的地方。

Angular如何使用Golang和websockets管理URL？

1 个答案:

TL; DR