如何在没有冗余标头配置的情况下创建Aurelia服务？

Question

我目前正在开发一个使用Aurelia作为前端框架的项目，我想知道在我的API服务中设置请求头是否有一种更有说服力且更少冗余的方式。以下是一个例子。

在这个Post服务中，我创建了一个configureHeaders方法，我在每个API调用之前调用它，否则，我遇到Web令牌已更改但请求标头未更新的情况。虽然创建这个configureHeaders方法是一个功能性的解决方法，但我必须为我的每个服务做这件事，而且感觉非常多余。

有没有办法在应用程序范围内配置请求标头，这样我就不必为每个服务创建一个configureHeaders方法并为每个请求调用它？

import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-http-client';

import environment from 'environment';

@inject(HttpClient)
export class Post {

    constructor(http) {
        this.http = http;
    }

    configureHeaders() {
        this.token = window.localStorage.getItem('token') || null;
        this.http = this.http
          .configure(x => {
            x.withBaseUrl(environment.serverBaseURL);
            x.withHeader('Authorization', `Bearer ${this.token}`);
          });       
    }

    getPosts() {
        this.configureHeaders();

        return this.http.get('post')    
        .then(posts => {
            return JSON.parse(posts.response);
        });
    }

}

Answer 1

正如R.Richards评论的那样，Aurelia的HttpClient拦截器就是你所追求的。

这是一个类示例 - 与具有匿名函数的对象相对

1.）声明拦截器

import {Interceptor, HttpResponseMessage, RequestMessage} from 'aurelia-http-client'

export class CustomInterceptor implements Interceptor {
  request(request: RequestMessage): RequestMessage {
    //Do request interceptor here
    return request;
  }
  response(response: HttpResponseMessage): HttpResponseMessage{
    //Do response interception here
    return response;
  }
}

2.）将拦截器注册为main.js中默认http客户端的一部分

import {CustomInterceptor} from 'path/to/custom-interceptor'

...
...

http.configure(config => {
  //config stuff here
).withInterceptor(new CustomInterceptor())

这应该适合你的口才！