Question

我无法访问受API保护的路由，因为VueJS并未将身份验证令牌发送到nodejs服务器。最初这一切正常，但只是停止工作。前端的令牌登录和存储按预期工作。通过邮递员使用令牌访问相同的路线也可以。这是main.js

Vue.axios.defaults.headers.common['x-access-token']=localStorage.getItem('token')
Vue.axios.defaults.baseURL = 'http://localhost:3000/api/';

执行此操作：console.log（Vue.axios.defaults.headers.common）打印带有x-access-token的对象。这清楚地表明令牌已存储在本地存储中，并已成功传递给main.js。问题在于令牌未与http请求一起发送到服务器**。我的Auth.js中间件**

const jwt = require('jsonwebtoken');
var env       = process.env.NODE_ENV || 'development';
var config = require(__dirname + '/../config/config.json')[env];

module.exports = (req, res, next)=>{

    const token = req.headers['x-access-token'];
    if(!token){
        return res.status(400).json({message:'No token provided!'})
    }

try{
    const decoded = jwt.verify(token,config.secret);
req.userData = decoded;
console.log(decoded)
return next();
}
catch(error){
return res.status(401).json({message:'Auth Failed!'});
}
};

服务器响应：

`No Token Provided`!

我在app.js中添加了以下内容来解决CORS问题，但我认为这不是由于CORS引起的。

const cors = require('cors');
app.use(cors()); // Enable CORS

任何帮助，我可能在配置方面做错了什么。

Answer 1

如果服务器希望使用承载令牌，则可以在Authorization Header中传递该令牌，请参见下面的代码示例，该示例从本地存储中检索令牌并将其设置为默认标头。

const token = localStorage.getItem('token')

axios.defaults.headers['Authorization'] = 'Bearer ' + token

Vue.js未将身份验证令牌发送到服务器

1 个答案: