javascript - 如何使用角度访问保存在标头中的令牌
问题描述
我将使用 JWT 生成的“auth-token”发送到内置 angular 的前端。后端内置在 nodejs 中。当我尝试从前端访问 auth-token 变量时,它说语法错误。如何在我的角度代码中访问此标头令牌?
组件中的前端请求
onSubmit(){
if(!this.signinForm.valid){
return;
}
const userDetails: SigninAccount = {
email: this.signinForm.controls.email.value,
password: this.signinForm.controls.password.value
}
this.loginservice.loginUser(userDetails).subscribe(
data => { console.log(data);
this.router.navigate(['/'])
},
error => { console.log(error.error)}
)
}
前端服务和标头选项
const loginhttpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
})
}
loginUser(user: SigninAccount): Observable<SigninAccount> {
const makeReqURL = `${this.apiURL}/login`;
const loginUser = this.http.post<SignupAccount>(makeReqURL, user, httpOptions)
return loginUser;
}
后端响应
const userToken = jwt.sign({ _id: user._id }, process.env.TOKEN);
res.header('auth-token', userToken).send(userToken)
浏览器中图像的屏幕截图以及由于 console.log(data) 而给出的语法错误消息。
“文本”也有 JWT 令牌,它与“身份验证令牌”相同,但不知道如何在代码中访问它,我也不知道什么是语法错误。
请帮忙。非常感谢您提前。
解决方案
后端代码中一定存在一些语法问题,这就是您收到错误的原因。使用一些像 EsLint 这样的 linter 可以帮助检测错误。
如何访问 authToken?
这是您的新后端代码。
不要在标头中设置令牌,而是作为 json 发送。
const userToken = jwt.sign({ _id: user._id }, process.env.TOKEN);
res.json({token: userToken});
前端代码是正确的,你会得到你token
的控制台。
this.loginservice.loginUser(userDetails).subscribe(
data => {
console.log(data);
const token = data.token;
//Save to localStorage
localStorage.setItem('token',token);
this.router.navigate(['/']);
},
error => { console.log(error.error)}
推荐阅读
- machine-learning - 如何基于微调的 VGGNet16 创建子模型
- java - IntelliJ 2019.3 中的 Gradle 多模块构建的注释处理器配置似乎无法正常工作
- progressive-web-apps - 在独立模式下检测来自 PWA 的请求
- php - 使用 PHP 分割 url
- excel - 填写动态列名的条件(powerquery)
- scikit-learn - 均方误差 (MSE) 均方根误差 (RMSE)
- google-apps-script - 电子表格上的电子邮件警报脚本
- ruby - How to create
... node in Nokogiri? - android-studio - 如何将我的 Flutter 项目从 vscode 迁移到 Android Studio?
- javascript - 尝试使用 expressJS 重定向时“被 CORS 策略阻止”