Mau*_*ice 4 angular-http-interceptors angular angular5
我是Angular的新手,我刚刚建立了一个拦截器.根据多个教程,你必须包括HTTP_INTERCEPTORS在app.module像这样:
providers: [{ provide: HTTP_INTERCEPTORS, useClass: MyInterceptor, multi: true }]
Run Code Online (Sandbox Code Playgroud)
我想知道该multi: true属性是什么意思/做什么以及它是否可以省略.
我已经阅读了有关此属性的angular.io指南.他们解释如下:
我不明白这一部分:
注意multi:true选项.这个必需的设置告诉Angular,HTTP_INTERCEPTORS是一个多提供者的标记,它注入一个值数组,而不是一个值.
这有点说明了这个概念,但是当拦截器注入多个值而不是它时,我还不太了解.例如,我自己的拦截器只是更改标题.这是否意味着它只注入一个值?
谢谢
编辑:
这是我的拦截器
import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { LoginService } from '../Services/login.service';
@Injectable()
export class JwtInterceptor implements HttpInterceptor {
constructor(private loginService:LoginService){}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// add authorization header with jwt token if available
console.log("ik zit nu in de interceptor");
let currentUser = this.loginService.getToken();
if (currentUser !=="") {
request = request.clone({
headers: new HttpHeaders({
'Content-Type': 'application/json',
'Authorization': `Bearer ${currentUser}`
})
});
}
return next.handle(request);
}
}
Run Code Online (Sandbox Code Playgroud)
这是app.module的提供列表
providers: [
{ provide: APP_BASE_HREF, useValue: '/' },
{ provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
{ provide: 'AUTH_URL', useValue: 'http://localhost:8080/auth' },
{ provide: 'API_URL', useValue: 'http://localhost:8080/api' },
{ provide: 'HEADERS', useValue: new HttpHeaders({'Content-Type': 'application/json'}) },
LoginGuard,
LoginService,
UserService,
MessageService
],
Run Code Online (Sandbox Code Playgroud)
lea*_*iro 10
从ValueProvider接口的描述中我们可以读取multi属性:
如果为true,则inject返回一个实例数组.这对于允许多个提供程序分布在多个文件中以向公共令牌提供配置信息非常有用.
这意味着对于我们提供值的令牌,将使用多个值(或类).
例如,请参阅此示例(这是一个示例项目),其中为令牌指定injector使用class(HTTP_INTERCEPTORS)useClass和ErrorInterceptor.为了使这个工作,我们需要指定SecurityInterceptor,以便让Angular知道将使用多个值(或类).
{
provide: HTTP_INTERCEPTORS,
useClass: ErrorInterceptor,
multi: true
},
{
provide: HTTP_INTERCEPTORS,
useClass: SecurityInterceptor,
multi: true
},
Run Code Online (Sandbox Code Playgroud)
这里的一个关键点是,multi: true是一个多供应商的令牌.这意味着当为此令牌提供新值或类时,属性HTTP_INTERCEPTORS是必需的,并且必须将其设置为multi.
请参阅HttpClient文档,其中描述了如何为拦截器提供声明的部分:
请注意该
true选项.这个必需的设置告诉Angular,HTTP_INTERCEPTORS是一个多提供者的标记,它注入一个值数组,而不是一个值.
| 归档时间: |
|
| 查看次数: |
3547 次 |
| 最近记录: |