维护生成的注入服务令牌

时间:2018-02-05 22:50:59

标签: angular typescript angular5

我正在创建一个服务来生成随机令牌并将其传递给请求(In developers Spotify they strongly recommend you to do so)。有一个查询参数(状态)!

这是我的服务:

import { Injectable } from '@angular/core';

@Injectable()
export class TokenService {
    private _state: string;

    constructor() {
        alert('Token got created');
    }

    public get state(): string {
        return this._state;
    }

    generateToken() {
        this._state = this.randomString() + this.randomString();
        alert(this._state);
    }

    private randomString() {
        return Math.random().toString(36).substring(2);
    }
}

我在这里称呼它:

...
@Injectable()
export class AngularSpotifyService { 
...
constructor(private windowRef: WindowService, private token: TokenService) { }

getToken(windowName = this.name, windowOptions = this.getOptions()) {
    this.windowRef.nativeWindow.open(`https://accounts.spotify.com/authorize?${this.toQueryString()}`,
      windowName, windowOptions);
}

private toQueryString(): string {
    this.token.generateToken();
    return `client_id=${this.clientId}&response_type=${this.responseType}&redirect_uri=${this.redirectUri}&state=${this.token.state}`;
}

这两个服务在启动应用程序时以及来自spotify的响应时都会被创建两次。

预期行为 我正在生成一个随机字符串来填充状态查询参数。当响应到达时,我期待令牌服务不再被创建(我认为是正常行为),因为如果是这样,它将生成一个新的随机字符串然后,状态查询参数(再次返回Spotify响应不再相等。

这是我的app.module:

...
@NgModule({
  declarations: [
      AppComponent,
      TokenComponent,
      AngularSpotifyComponent
  ],
  imports: [
      BrowserModule,
      RouterModule.forRoot(appRoutes)
  ],
  providers: [WindowService, AngularSpotifyService, TokenService],
  exports: [ RouterModule ],
  bootstrap: [AppComponent]
})
export class SpotifyModule { }

1 个答案:

答案 0 :(得分:1)

您可以通过类/服务中的静态属性("object initializers")来完成此操作。我做了plunkr来演示。

但问题的关键在于变量声明是在构造函数之外完成的,并且是在"旋转"因此,多次实例化它的类的时间不会影响该值。

export class Example{
  static value: string = Math.random().toString(36).substring(2);

  constructor(){
    console.log(Example.value);
  }

  public getValue(){
    return Example.value;
  }
}

this.example1 = new Example();
this.example2 = new Example();


// NOW!
this.example1.getValue() == this.example2.getValue()

所以只是为了澄清我的观点...

private _state: string;替换为上述类,然后在以前使用example.getValue()的任何地方使用_state

所以新服务将如下所示:

@Injectable()
export class TokenService {
    private example: Example;

    constructor() {
        this.example = new Example();
        alert('Token got created');
    }

    public get state(): string {
        return this.example.getValue();
    }

}

显然,您可能会将Example类重命名为您认为合适的任何内容。