没有调用Angular2-jwt AuthHttp请求

Question

我一直在跟踪本指南，在一个Ionic 2应用程序中设置JWT身份验证。登录端的功能非常好，但是当我尝试使用AuthHttp类时，在Chrome的network选项卡或服务器端都不会发出任何请求，也不会显示任何内容。

我的app.ts文件中有以下内容：

import 'es6-shim';
import {App, IonicApp, Platform, MenuController} from 'ionic-angular';
import {HTTP_PROVIDERS, Http, Headers} from 'angular2/http';
import {provide} from 'angular2/core';
import {AuthHttp, AuthConfig} from 'angular2-jwt';
import {AuthData} from './providers/auth-data';
import {UserData} from './providers/user-data';


@App({
    templateUrl: 'build/app.html',
    providers: [
        HTTP_PROVIDERS,
        provide(AuthHttp, {
            useFactory: (http) => {
                return new AuthHttp(new AuthConfig(), http);
            },
            deps: [Http]
        }),
        AuthData,
        UserData
    ],
    config: {
        apiURL: 'http://localhost:9000'
    } // http://ionicframework.com/docs/v2/api/config/Config/
})

然后在用户数据中，我得到了这个：

import {Injectable} from 'angular2/core';
import {Http, Headers, RequestOptions} from 'angular2/http';
import {Config, Storage, LocalStorage, Events} from 'ionic-angular';
import {AuthHttp, JwtHelper, tokenNotExpired} from 'angular2-jwt';
import {Observable} from 'rxjs/Observable';
import 'rxjs/Rx';

/**
 * @name UserData
 * @description
 * Provider for any user related data.
 */
@Injectable()
export class UserData {

  apiURL: string;
  contentHeader: Headers = new Headers({'Content-Type': 'application/json'});
  error: string;
  jwtHelper: JwtHelper = new JwtHelper();
  local: Storage = new Storage(LocalStorage);
  storage: any;
  user: any;

  constructor(
    public authHttp: AuthHttp,
    private config: Config,
    private events: Events,
    private http: Http
  ) {
    this.apiURL = config.get('apiURL');
    let token = this.local.get('id_token')._result;
    if (token) {
      this.user = this.jwtHelper.decodeToken(token);
    }
  }

  getUser() {
    return new Promise(resolve => {

      this.authHttp.get(this.apiURL+'/api/users/me', {
        headers: this.contentHeader
      })
      .map(res => res.json())
      .subscribe(
        data => {
          resolve('test');
        },
        err => {
          console.log(err);
        }
      );

    });
  }

}

有人能告诉我哪里出了问题如果我遗漏了什么吗？我已经浏览了很多次angular2-jwt文档，在我看来一切都还好。

谢谢你的帮助。

编辑：

如果我在console.log(this.authHttp)函数中执行getUser()，它将记录以下内容：

AuthHttp {http: Http, _config: Object, tokenStream: Observable}

Answer 1

不是完美的解决方案，但我注意到在Ionic的这个类似的指南中，他们将angular2-jwt版本指定为0.1.6。降级到这个版本，它工作正常！

Answer 2

我认为您忘记在应用程序的HTTP_PROVIDERS属性中指定providers：

import {HTTP_PROVIDERS, Http} from 'angular2/http';
(...)

@App({
  templateUrl: 'build/app.html',
  providers: [
    HTTP_PROVIDERS,
    provide(AuthHttp, {
        useFactory: (http) => {
            return new AuthHttp(new AuthConfig(), http);
        },
        deps: [Http]
    }),
    AuthData,
    UserData
  ],
  config: {
     apiURL: 'http://localhost:9000'
  } // http://ionicframework.com/docs/v2/api/config/Config/
})

编辑

只需导入Headers类：

import {HTTP_PROVIDERS, Http, Headers} from 'angular2/http';

Answer 3

最近对angular2-jwt的更新应该可以很好地处理最新的Ionic 2版本。你能检查一下这个回购，然后告诉我它是否对你有用吗？:) https://github.com/auth0-samples/auth0-ionic2-samples

编辑:更新链接