Angular 7 Headers 未设置
Angular 7 Headers aren't getting set
我正在使用 Angular 7 并创建了一个拦截器以在每个请求中包含身份验证令牌。
这是我的拦截器代码:
import { Observable } from 'rxjs';
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
@Injectable()
export class JwtInterceptor implements HttpInterceptor {
constructor() { }
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const token = localStorage.getItem('authToken');
if (token) {
request = request.clone({
setHeaders: {
authorization: token
}
});
}
return next.handle(request);
}
}
要验证身份验证令牌的节点api:
const jwt = require('jsonwebtoken');
function verifyToken(req, res, next) {
var token = req.headers['authorization']; // Coming Undefined
if (!token)
return res.status(403).send({ auth: false, message: 'No token provided.' });
jwt.verify(token, 'top_secret', function (err, decoded) {
if (err)
return res.status(500).send({ auth: false, message: 'Failed to authenticate token.' });
// if everything good, save to request for use in other routes
req.userId = decoded.user.email;
next();
});
}
module.exports = verifyToken;
当使用 Postman 访问 API 时一切正常,但是当使用 angular 代码发送请求时 headers 未在节点 API 处收到。
这种奇怪行为的可能原因是什么?
我在拦截器和克隆请求以及授权方面遇到了类似的问题。
我必须添加内容类型并接受 headers 并告诉服务器它是 json:
setHeaders: {
'Content-Type' : 'application/json; charset=utf-8',
'Accept' : 'application/json',
'Authorization': '' // your token
}
试着这样做
request.clone({
headers: request.headers.set(
'Authorization',
localStorage.getItem('token')
)
})
您显示的屏幕截图用于 CORS 所需的 OPTIONS 请求。您需要在 nodejs
中启用 CORS
首先,安装cors
模块
npm install cors
然后在你的nodejs后端使用它
var cors = require('cors');
app.use(cors());
我正在使用 Angular 7 并创建了一个拦截器以在每个请求中包含身份验证令牌。
这是我的拦截器代码:
import { Observable } from 'rxjs';
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
@Injectable()
export class JwtInterceptor implements HttpInterceptor {
constructor() { }
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const token = localStorage.getItem('authToken');
if (token) {
request = request.clone({
setHeaders: {
authorization: token
}
});
}
return next.handle(request);
}
}
要验证身份验证令牌的节点api:
const jwt = require('jsonwebtoken');
function verifyToken(req, res, next) {
var token = req.headers['authorization']; // Coming Undefined
if (!token)
return res.status(403).send({ auth: false, message: 'No token provided.' });
jwt.verify(token, 'top_secret', function (err, decoded) {
if (err)
return res.status(500).send({ auth: false, message: 'Failed to authenticate token.' });
// if everything good, save to request for use in other routes
req.userId = decoded.user.email;
next();
});
}
module.exports = verifyToken;
当使用 Postman 访问 API 时一切正常,但是当使用 angular 代码发送请求时 headers 未在节点 API 处收到。
我在拦截器和克隆请求以及授权方面遇到了类似的问题。
我必须添加内容类型并接受 headers 并告诉服务器它是 json:
setHeaders: {
'Content-Type' : 'application/json; charset=utf-8',
'Accept' : 'application/json',
'Authorization': '' // your token
}
试着这样做
request.clone({
headers: request.headers.set(
'Authorization',
localStorage.getItem('token')
)
})
您显示的屏幕截图用于 CORS 所需的 OPTIONS 请求。您需要在 nodejs
中启用 CORS首先,安装cors
模块
npm install cors
然后在你的nodejs后端使用它
var cors = require('cors');
app.use(cors());