Question

我有一个非常简单的用户后端，并且可以运行（节点，快递，猫鼬，mongo等），邮递员可以验证何时添加用户可以正常工作，当我请求登录时可以正常工作并获得令牌，以及如果我输入了错误的详细信息，它将拒绝它，

现在，我使用了这个git hub repo https://github.com/christiannwamba/vue-auth-vuex来为此增加一个简单的前端。我认为一切正常，因为它似乎正在登录，直到我发现它接受了我为电子邮件和密码输入的所有正确信息为止。

当我用vue应用程序命中后端服务器时，后端服务器始终保持正常响应，但是在我进行控制台登录时，仔细检查了它正在获取的内容，这是空的，并且找不到返回的用户。所以我再次认为这里没有任何问题。

我在chrome开发工具网络中注意到的某件事，它正在发送两个版本的身份验证，第一个为空，然后下一个具有响应。

我有点茫然，为什么它第一次发送空请求，以及为什么当它得到不好的回报时却允许登录。

Server.js文件：

const express = require('express');
const logger = require('morgan');
const movies = require('./routes/movies') ;
const users = require('./routes/users');
const bodyParser = require('body-parser');
const mongoose = require('./config/database'); //database configuration
var jwt = require('jsonwebtoken');
var cors = require('cors')
const app = express();

// Add cors
app.use(cors());
app.options('*', cors());  // enable pre-flight

app.set('secretKey', 'nodeRestApi'); // jwt secret token

// connection to mongodb
mongoose.connection.on('error', console.error.bind(console, 'MongoDB connection error:'));

app.use(logger('dev'));
app.use(bodyParser.urlencoded({extended: false}));

app.get('/', function(req, res){
res.json({"api" : "User API"});
});

// public route
app.use('/users', users);

// private route
app.use('/movies', validateUser, movies);


app.get('/favicon.ico', function(req, res) {
    res.sendStatus(204);
});

function validateUser(req, res, next) {
  jwt.verify(req.headers['x-access-token'], req.app.get('secretKey'), function(err, decoded) {
    if (err) {
      res.json({status:"error", message: err.message, data:null});
    }else{
      // add user id to request
      req.body.userId = decoded.id;
      next();
    }
  });

}


// express doesn't consider not found 404 as an error so we need to handle 404 it explicitly
// handle 404 error
app.use(function(req, res, next) {
    let err = new Error('Not Found');
    err.status = 404;
    next(err);
});

// handle errors
app.use(function(err, req, res, next) {
    console.log(err);

  if(err.status === 404)
    res.status(404).json({message: "Not found"});
  else  
    res.status(500).json({message: "Something looks wrong :( !!!"});

});

app.listen(3000, function(){
    console.log('Node server listening on port 3000');
});

更新：

我在server.js的CORS位下面添加了

app.options('/users/authenticate', function(req, res){
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'POST');
  res.end();
});

在网络中，我现在只收到一个请求。在表单数据下，它似乎在那里，但在响应中表示数据为null，更奇怪的是，vuejs仍在登录并允许访问受限制的页面。

Answer 1

看起来像CORS问题。如果您使用其他服务器运行UI，并且后端本身在运行，则浏览器将首先发送飞行前请求，这是一个选项请求。这就是在开发人员工具中看到2个身份验证请求的原因。您可以在这里了解更多信息 Why is an OPTIONS request sent and can I disable it?

Answer 2

暂时将标题设置为application/x-www-form-urlencoded的行注释掉。然后将app.use(bodyParser.json())添加到您的server.js中，看看它是否有效。这是因为您的请求对象格式错误，这就是服务器无法正确解析请求的原因。

发布到后端，但请求始终为空（取决于节点）

2 个答案: