Angular No Token found returning 404

Question

我想我在代码中的某个地方犯了一些错误。

我正在尝试访问一个端点，该端点返回其他路由的所有注册用户的JSON列表。此路由需要一个管理令牌。

目前，管理员可以注册并登录以获得分配的令牌。

我在将管理路由的令牌传递到学生路由时遇到问题。

我正在处理getAllExtensionAgents()，所以getAllExtensionAgents((端点的请求假定返回其他路由的所有注册用户的JSON列表。

ApiService.ts

import { Injectable } from '@angular/core';
import { environment } from '../../environments/environment'
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Router } from '@angular/router';
import { Logs } from './api.model';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class ApiService {
ApiURL = environment.apiURL;
myToken: string;
constructor(private http: HttpClient, private router: Router) {
this.getToken();
}
httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
'x-access-token': 'localStorage.getItem(token)'
})
};
registerUser(data: Logs) {
return this.http.post(this.ApiURL + 'admin/auth/signup', data, { headers: this.httpOptions.headers })
}
loginUser(data: Logs) {
return this.http.post(this.ApiURL + 'admin/auth/login', data) as Observable<{ secret: string, token: string }>;
}
getAllExtensionAgents(myToken: any) {
return this.http.get(this.ApiURL + '/api/v1/admin/ea/', this.httpOptions)
}
storeToken(token: string) {
return localStorage.setItem('token', token);
console.log('get tok', token)
}
getToken() {
this.myToken = localStorage.getItem('token');
// console.log('local storage', this.myToken)
}
}

Answer 1

我建议使用HttpInterceptor在每个请求中传递令牌。

您的代码将是

Injectable()
export class I2 implements HttpInterceptor {
constructor(
private injector: Injector
) {
}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const modified = req.clone({setHeaders: {'x-access-token': localStorage.getItem(token)}});
return next.handle(modified);
}
}

您的应用程序模块将如下所示。

@NgModule({
imports: [BrowserModule, HttpClientModule],
declarations: [AppComponent],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: I2,
multi: true
}
],
bootstrap: [AppComponent]
})
export class AppModule {
}