Question

在我的应用程序中，每当加载应用程序时。首先，它重定向到Login组件，我从该用户获取数据（用户名和密码），然后单击“登录”按钮。我将用户名和密码发送到服务器并获取授权密钥，即我将其设置到浏览器的sessionStorage中。

this.http.post('/app/getUserByEmailAndPassword',userParams,{headers : this.headers}).subscribe(response=>{
  if(response.status == 200){
     var data = response.json();
     sessionStorage.setItem('Authorization',data.authKey);
     this.userName = data.userName;
  } else {
     console.log("Error Occured While Logging In");
  }
})

我在我的应用程序中使用@stomp/ng-stomp作为Websocket连接。现在我的要求是，我正在app.module.ts中配置stomp，以便所有其他子组件都可以访问它。

import { endponitConfig } from './../environments/endpoints';
import { NgModule, ApplicationRef } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
/*
 * Platform and Environment providers/directives/pipes
 */
import { routing } from './app.routing'
// App is our top level component
import { AppComponent } from './app.component';
import { APP_RESOLVER_PROVIDERS } from './app.resolver';
import { AppState, InternalStateType } from './app.service';
// Core providers
import {CoreModule} from './core/core.module';
import {SmartadminLayoutModule} from './shared/layout/layout.module';
import { ModalModule } from 'ngx-bootstrap/modal';
import { AuthGuard } from './+auth/+guards/index';
import { userRoleGuard } from './+auth/+guards/userRole.guard';
import { ChartModule } from 'angular-highcharts';
import * as SockJS from 'sockjs-client';
import {StompConfig, StompService} from '@stomp/ng2-stompjs';
import {} from 'jasmine';

export function socketProvider() {
  return new SockJS(endponitConfig.WEBSOCKET_URL);
}

const stompConfig: StompConfig = {
  url: socketProvider,
  headers:{
    AuthToken : sessionStorage.getItem('Authorization')
  },
  heartbeat_in: 0,
  heartbeat_out: 20000,
  reconnect_delay: 5000,
  debug: true
};
// Application wide providers
const APP_PROVIDERS = [
  ...APP_RESOLVER_PROVIDERS,
  AppState
];

interface StoreType {
  state: InternalStateType,
  restoreInputValues: () => void,
  disposeOldHosts: () => void
}

/**
 * `AppModule` is the main entry point into Angular2's bootstraping process
 */
@NgModule({
  bootstrap: [ AppComponent ],
  declarations: [
    AppComponent,
  ],
  imports: [ // import Angular's modules
    BrowserModule,
    BrowserAnimationsModule,
    FormsModule,
    HttpModule,
    ChartModule,
    ModalModule.forRoot(),
    CoreModule,
    SmartadminLayoutModule,
    routing
  ],
  exports: [
  ],
  providers: [ // expose our Services and Providers into Angular's dependency injection
    // ENV_PROVIDERS,
    AuthGuard,
    userRoleGuard,
    APP_PROVIDERS,
    StompService,
    {
      provide: StompConfig,
      useValue: stompConfig
    }
  ]
})
export class AppModule {
  constructor(public appRef: ApplicationRef, public appState: AppState) {}
}

现在，如果你看一下stompConfig对象

const stompConfig: StompConfig = {
  url: socketProvider,
  headers:{
    AuthToken : sessionStorage.getItem('Authentication')
  },
  heartbeat_in: 0,
  heartbeat_out: 20000,
  reconnect_delay: 5000,
  debug: true
};

我必须在连接到sockjs时使用授权令牌，但是当我从会话存储中获取数据时它返回null。我将登录组件作为app.component.ts的子组件。

那么，有没有办法从app.module.ts中的sessionStorage获取数据。

我们可以让它可以观察到，如果是，那么如何？

Answer 1

您应该使用服务来设置全局变量。您可以在服务中执行以下操作：

stompConfig:StompConfig;
flag=false;

getStomp(): any {
    if (flag) {
        return stompConfig;
    }
    else {
        if (sessionStorage.getItem('Authentication') != null) {
            this.stompConfig: StompConfig = {
                url: socketProvider,
                headers: {
                    AuthToken: sessionStorage.getItem('Authentication')
                },
                heartbeat_in: 0,
                heartbeat_out: 20000,
                reconnect_delay: 5000,
                debug: true
            };
            flag=true;

            return stompConfig;
        }
        else { return null; }
    }
}

从组件中调用此函数以获取对象。

从app.module.ts中的sessionStorage获取数据

1 个答案: