2

我有一个使用ngx-socket-io的 ngModule ，我删除了不必要的导入和注入 :) 正如你所看到的，我已经评论了一些代码，这些代码仅在应用程序的开发构建中像魅力一样起作用，只要我使用 - -prod 这些变量将不再起作用，如果记录到控制台，则该值与静态声明相同，但 SocketIoModule.forRoot(socketConfig) 如果使用 --prod 标志构建则不会看到它们

import { SocketIoModule, SocketIoConfig } from "ngx-socket-io";
const socketConfig = {
    url: 'http://localhost:3000',
    options: {
        query: {
            userId: "f9ae03de-f043-4704-882e-d269ee514805"
        }
    }
};

// const userId = (<any>window).MaxDuel.instance.userId;
// const socket = (<any>window).MaxDuel.instance.socket;
// const socketConfig = {url: socket, options: {query: {userId}}};
// const socketConfig2 = JSON.parse(JSON.stringify(socketConfig));
console.log(socketConfig);

@NgModule({
  declarations: [],
  imports: [
    SocketIoModule.forRoot(socketConfig)
  ],
  entryComponents: [],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

但是在注释变量并引入相同的副本但在静态声明中之后，应用程序再次开始工作！正如你所看到的，我什至序列化和反序列化以模拟静态声明，但又没有！

主要问题是我需要连接时的用户 ID，并且该变量不能是静态的

4

1 回答 1

1

这是因为当你运行ng build --prodAOT 编译器时默认使用，这意味着你的代码在服务器上构建并提供给用户。那时，没有window对象或MaxDuel对象。所以，你需要找到另一种方法。幸运的是，有！

我阅读了您使用的库的文档。还有另一种方法来实例化Socket. 在这里你可以读到它

您需要创建自己的Socket并提供它。

import { Injectable, NgModule } from '@angular/core';
import { Socket } from 'ngx-socket-io';

@Injectable()
export class MySocket extends Socket {

    constructor() {
        super({url: window.MaxDuel.instance.socket, 
               options: {
                 query: {window.MaxDuel.instance.userId
              }});
    }

}

@NgModule({
  declarations: [
    //components
  ],
  imports: [
    SocketIoModule,
    //...
  ],
  providers: [{
     provide: Socket, useClass: MySocket
  }],
  bootstrap: [/** AppComponent **/]
})
export class AppModule { }

现在，您可以在应用程序的任何位置注入Socket并使用它。

于 2018-11-25T23:45:28.903 回答