邮递员工作时，Ajax 请求不断失败，请求错误

Posted 2023-05-08

【中文标题】邮递员工作时，Ajax 请求不断失败，请求错误

【英文标题】：Ajax request keeps failing with bad request when Postman works

【发布时间】：2018-12-15 14:17:09

【问题描述】：

所以我已经研究了几个小时并尝试了不同的东西，并且已经研究了几个小时无济于事。该调用是在提供用户并通过后获取 JWT 令牌。

function listenForLogin() 
    console.log('listening')
    $('#submit-btn').on('click', e => 
    e.preventDefault();
    console.log('button-pressed');

    const username = $('#user-input').val().trim();
    const password = $('#pass-input').val().trim();

    var user = 
    user.username = username;
    user.password = password
    console.log(user);
    $('#user-input').val('');
    $('#pass-input').val('');

    authenticateUser(user);
);




//send to autenticate
function authenticateUser(user) 
    console.log('trying to authenticate');
    const settings = 
        url:"/api/auth/login",
        data: JSON.stringify(user),
        dataType: "json",
        method:"POST",
        success: (data) => 
            console.log('authenticated user');
            redirectWithToken(data.authToken, user);
        ,
        error: (err) => console.log(err)
    
    $.ajax(settings);

 

当它访问服务器时，摩根看到有一个请求，但我返回 400 的状态。这是我的路线

'use strict';

const express = require('express');
const passport = require('passport');
const bodyParser = require('body-parser');
const jwt = require('jsonwebtoken');
const JWT_SECRET, JWT_EXPIRY = require('dotenv').config();

const router = express.Router();

const createAuthToken = function(user) 

  return jwt.sign(user, 'shade', 
    subject: user.username,
    expiresIn: '7d',
    algorithm: 'HS256'
  );
;

const localAuth = passport.authenticate('local', session: false);

router.use(bodyParser.json());

router.post('/login', localAuth, (req, res) => 
  const authToken = createAuthToken(req.user.serialize());
  res.json(authToken);
);

const jwtAuth = passport.authenticate('jwt', session: false);

router.post('/refresh', jwtAuth, (req, res) => 
    console.log('refresh targeted');
    const authToken = createAuthToken(req.user);
    res.json(authToken);
);

router.get('/dashboard/:user', jwtAuth, (req, res) => 
    res.redirect(`https:flow-state.herokuapp.com/dashboard/$req.params.user`);
)

module.exports = router; 

我很难理解 passport.authenticate('localAuth') 是如何工作的，所以这是我的策略文件，以备不时之需

更新：我在检查提琴手上的请求时遇到了某种错误。

响应字节（按内容类型）

~标题~：132 ~???????~: 11

有人知道这是什么意思吗？

【问题讨论】：

如果它在邮递员中工作，在提琴手中捕获请求并将其与您的 JS 请求进行比较，您应该很快就会看到差异

我使用 fetch，所以我不会回答，但如果我记得我在 jQuery 中工作时，我认为“POST”应该是“post”，但我不能确定。此外，如果您在本地测试环境中，您将需要 CORS 模式。

cors 已经设置好了，在提琴手上我确实发现了一些看起来可疑的东西

响应字节（按内容类型）-------------- ~headers~: 132 ~???????~: 11

不用JSON.stringify，直接传JSON对象即可

【参考方案1】：

您是否错过了 ajax 设置中的内容类型？ 在ajax设置中添加contentType: "application/json"，然后重试。

注意：

dataType 定义了服务器响应的预期数据类型。

contentType 定义将发送到服务器的内容的数据类型。默认为：“application/x-www-form-urlencoded”

【讨论】：

这仍然是通过 ajax 而不是对象发送查询字符串。我认为这是最终的问题，但我不知道如何纠正它

ajax中认证的url是否指向外部服务器？如果是，您必须在 ajax 请求中为 CORS (developer.mozilla.org/en-US/docs/Web/HTTP/CORS) 设置标头：Access-Control-Allow-Origin : '*', Access-Control-Allow-Headers : 'Content-Type'

【参考方案2】：

8 小时后，一个令人头疼的解决方案就在这里。 @vignz.pie 你是对的，但我需要在标题中发送 'Content-Type': 'application/json' 以及设置 processData: false 的数据。感谢您的帮助！

function listenForLogin() 
    console.log('listening')

    $('#submit-btn').on('click', e => 

    e.preventDefault();
    console.log('button-pressed');

    const username = $('#user-input').val().trim();
    const password = $('#pass-input').val().trim();

    $('#user-input').val('');
    $('#pass-input').val('');

    authenticateUser(username, password);

    );




//send to autenticate
function authenticateUser(user, pass) 
    var info = 
        username: user,
        password: pass
    ;
    console.log(info)
    const settings = 
        url:"/api/auth/login",
        headers: 
            "Content-Type": "application/json" 
        ,
        data: JSON.stringify(info),
        processData: false,
        dataType: "json",
        method:"POST",
        success: (data) => 
            console.log('authenticated user');
            redirectWithToken(data.authToken, user);
        ,
        error: (err) => console.log(err)
    
    $.ajax(settings);