Angular 8：ngx-socket-io 在 prod 模式下運行時重寫連接 url

Question

基本上，問題是在開發模式下，套接字客戶端連接到http://localhost:3002/socket.io/?EIO=3&transport=polling&t=N4--_Ms並且一切正常。

但是當我在 prod 模式下運行應用程序時，url 變為http://localhost/?EIO=3&transport=polling&t=N4--_Ms會引發 404 錯誤。

如果有人可以提供幫助，我想了解原因，當然還有修復。

我使用"ngx-socket-io": "^3.0.1" ，這是app.modules.ts中的配置

const ioConfig: SocketIoConfig = { url: "http://localhost:3002/socket.io", options: { secure: true, rejectUnauthorized: false } };

@NgModule({
  declarations: [
     AppComponent,
  ],
  imports: [
     AppRouting,
     BrowserModule,
     BrowserAnimationsModule,
     SocketIoModule.forRoot(ioConfig)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

socket.io 服務器連接到位於localhost:3002的 express 后端

Answer 1

我認為您正在尋找的是 SocketIOConfig 參數中的“路徑：字符串”選項。

我正在使用 Nginx 將代理反向代理到 NodeJS 服務器，所以我在 app.module.ts 中也遇到了使用此代碼的路徑截斷：

SocketIoModule.forRoot({ url: 'wss://localhost:9000/SomeUniqueEndpoint/', options: { transports: ['websocket'], allowUpgrades : true} }) 

我會檢查路徑，它只會說“wss://localhost:9000”... 404 not found。

而是在 app.module.ts 中執行此操作

SocketIoModule.forRoot({ url: 'wss://' + document.location.host , options: { transports: ['websocket'], allowUpgrades : true, path: '/SomeUniqueEndpoint/socket.io' } })

Answer 2

通過使用服務版本而不是按照 npm 中的文檔在 AppModule中注冊SocketIoModule來解決它。