$http.defaults.headers 在 Angular2 中

Question

我正在使用 JWT 进行授权。在 AngularJS 1.x 中，我使用以下函数登录：

    function login(username, password) {
        var deferred = $q.defer();

        $http.post("/api/login", {
            "username": username,
            "password": password
        }).then(function(response) {
            if (response.data && response.data.token) {
                var tokenBegin = response.data.token.substring(0,6);
                var bearer = (tokenBegin === 'Bearer') ? '' : 'Bearer ';
                $http.defaults.headers.common.Authorization = bearer + response.data.token;
                deferred.resolve({ status: true, message: 'Login complete' });
            } else {
                deferred.reject(response);
            }
        }, function(reason) {
            deferred.reject(reason)
        });

        return deferred.promise;
    }

正在修改 $http.defaults 对象。我对 Angular2 和 TypeScript 有点不知所措，因为 Http class 似乎没有 defaults 对象。我该怎么做？

Answer 1

有几种方法可以做到这一点：

您可以实现自己的 BaseRequestOptions class:

import {BaseRequestOptions, RequestOptions, RequestOptionsArgs} from '@angular/http';

export class AppRequestOptions extends BaseRequestOptions {
  constructor() {
  }

  merge(options?:RequestOptionsArgs):RequestOptions {
    options.url = 'https://www.test.org' + options.url;
    return super.merge(options);
  }
}

我是这样注册的：

bootstrap(App, [
  HTTP_PROVIDERS,
  provide(RequestOptions, {useClass: AppRequestOptions})
]);

扩展Http（或XHRBackend）class本身：

@Injectable()
export class CustomHttp extends Http {
  constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
    super(backend, defaultOptions);
  }

  request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
    console.log('request...');
    return super.request(url, options).catch(res => {
      // do something
    });        
  }

  get(url: string, options?: RequestOptionsArgs): Observable<Response> {
    console.log('get...');
    return super.get(url, options).catch(res => {
      // do something
    });
  }
}

并按如下所述进行注册：

bootstrap(AppComponent, [HTTP_PROVIDERS,
  new Provider(Http, {
    useFactory: (backend: XHRBackend, defaultOptions: RequestOptions) => new CustomHttp(backend, defaultOptions),
    deps: [XHRBackend, RequestOptions]
  })
]);

查看这些问题：

$http.defaults.headers 在 Angular2 中

$http.defaults.headers in Angular2

typescript

angular

angular2-services