Angular 2 Observable JWT Header问题

时间:2016-10-21 23:58:07

标签: angular angular2-observables

我遇到了一个奇怪的问题。我需要成功登录然后保存JWT,然后我需要使用新的Header发出另一个HTTP请求,其中包括JWT作为获取用户详细信息的授权。不幸的是,在我的第二个HTTP请求中,我错过了JWT。任何帮助将不胜感激。

以下是我的代码

API服务

import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { FormValidationService } from '../formValidation';
import { CredFormService } from './credForm.service';
import { AppState, GetUserService } from '../../services';

@Component({
  selector: 'ce-cred-form',
  styles: [require('./credForm.style.scss')],
  templateUrl: './credForm.html',
  providers: [FormValidationService, CredFormService]
})

export class CredFormComponent implements OnInit {
  @Input() credFormType: string;
  @Output() loggedIn = new EventEmitter();

  public credForm: FormGroup;
  public loginForm: FormGroup;
  public cred_error_message = false;
  public _token: string;

  constructor(
    private _fb: FormBuilder,
    private _validationService: FormValidationService,
    private _credFormService: CredFormService,
    public _appState: AppState,
    public _getUser: GetUserService ) {

    }

  ngOnInit() {
    this.cred_error_message = false;
    this.credForm = this._fb.group({
      name: ['', [Validators.required, Validators.minLength(3)]],
      email: ['', [Validators.required, this._validationService.emailValidator]],
      password: ['', [Validators.required, this._validationService.passwordValidator]],
    });
    this.loginForm = this._fb.group({
      email: ['', [Validators.required, this._validationService.emailValidator]],
      password: ['', [Validators.required]]
    });
  }

  signup() {
    this._credFormService.signup(this.credForm.value)
    .subscribe(
      res => {
        this.ngOnInit();
        this.loggedIn.emit({ _token: res.token });
      },
      err => {
        this.cred_error_message = JSON.parse(err._body).message;
      });
  }

  login() {
    this._credFormService.login(this.loginForm.value)
    .subscribe(
      res => {
        this.ngOnInit();
        // this.loggedIn.emit({ _token: res.token });
        this._token = res.token;
        localStorage.setItem('_token', this._token);
        this._appState.set('_token', this._token);
      },
      err => {
        this.cred_error_message = JSON.parse(err._body).message;
      },
      () => {


        this._getUser.getUser()
        .subscribe(
          res => console.log(res),
          err => console.log(err),
          () => console.log('get user complete')
        );
        this.loggedIn.emit({ _token: this._token });
      });
    // return this._credFormService.login(this.loginForm.value)
  }
}

登录组件

import { Injectable } from '@angular/core';
import { ApiService } from '../../services';
import 'rxjs/Rx';

@Injectable()
export class CredFormService {
  path: string = 'auth/';

  constructor( private _apiService: ApiService ) {

  }

  login(body) {
    return this._apiService.post(this.path + 'login', body);
  }

  signup(body) {
    return this._apiService.post(this.path + 'signup', body);
  }
}

登录服务

import { Injectable } from '@angular/core';
import { ApiService } from './restful.services';

@Injectable()
export class GetUserService {

  private _path: string = 'apis/user';

  constructor( private _apiService: ApiService ) { }

  getUser() {
    return this._apiService.getall(this._path);
  }

}

用户服务

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

export type InternalStateType = {
  [key: string]: any
};

@Injectable()
export class AppState {
  _state: InternalStateType = { };

  constructor() {

  }

  // already return a clone of the current state
  get state() {
    return this._state = this._clone(this._state);
  }
  // never allow mutation
  set state(value) {
    throw new Error('do not mutate the `.state` directly');
  }


  get(prop?: any) {
    // use our state getter for the clone
    const state = this.state;
    return state.hasOwnProperty(prop) ? state[prop] : state;
  }

  set(prop: string, value: any) {
    // internally mutate our state
    return this._state[prop] = value;
  }


  private _clone(object: InternalStateType) {
    // simple object clone
    return JSON.parse(JSON.stringify( object ));
  }
}

国家服务

<xsl:template match="something">

    <!-- some stuff -->

    <div>
        <xsl:call-template name="capitalize">
            <xsl:with-param name="text" select="clientName"/>
        </xsl:call-template>
    </div>

    <!-- other stuff -->

</xsl:template>


<xsl:template name="capitalize">
    <xsl:param name="text"/>
    <xsl:param name="delimiter" select="' '"/>

    <xsl:variable name="upper-case" select="'ABCDEFGHIJKLMNOPQRSTUVWXYZ'"/>
    <xsl:variable name="lower-case" select="'abcdefghijklmnopqrstuvwxyz'"/>

    <xsl:variable name="word" select="substring-before(concat($text, $delimiter), $delimiter)" />
    <xsl:value-of select="translate(substring($word, 1, 1), $lower-case, $upper-case)"/>    
    <xsl:value-of select="translate(substring($word, 2), $upper-case, $lower-case)"/>
    <xsl:if test="contains($text, $delimiter)">
        <xsl:value-of select="$delimiter"/>
        <!-- recursive call -->
        <xsl:call-template name="capitalize">
            <xsl:with-param name="text" select="substring-after($text, $delimiter)"/>
        </xsl:call-template>
    </xsl:if>
</xsl:template>

JWT没有在我的第二个请求中添加标题。

0 个答案:

没有答案