没有 json 从 axios 请求读取到 nodejs 服务器的数据

no json data read from axios request to nodejs server

我有一个注册页面,用户需要在其中确认密码。为此,我创建了以下 axios 和服务器端代码来处理请求。

TL;DR 使用找到的建议方法 here, and here, and here,我发送 axios 请求,格式为:

axios({
    method: 'get',
    url: '/my/server/endpoint',
    data: *json data*
});

在我的 nodejs (express) 服务器上,我监听 req.body(建议 here, here, here, here) content or req.data (suggested , )。

问题:

简单地说,req.body是一个空对象,req.data是未定义的(见下图)。

我有以下表达 app 设置

const app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(logger('dev'));
app.use(express.json());
app.use(helmet());
app.use(express.urlencoded({extended: false}));
app.use(cookieParser());
app.use('/assets', express.static(path.join(__dirname, '/assets')));
app.use(cors());
app.use(session({secret: config.secret, resave: false, saveUninitialized: false}));
app.use(passport.initialize({}));
app.use(passport.session({secret: config.secret}));
app.use(function(req,res,next){
    res.locals.session = req.session;
    next();
});
app.use(flash());

我可以确认通过 axios 请求发送的数据确实发送了有效数据。

我是不是做错了什么?

客户端代码

$('#btnSetVaultPassword').click(function () {
    $('#btnSetVaultPassword').prop("disabled", true);

    let password = $('#edtVaultPassword');
    let passwordConfirm = $('#edtVaultPasswordConfirm');

    // const data = ;

    axios({
        method: 'get',
        url: '/setup/setup-vault',
        data: {
            password: password.val(),
            passwordConfirm: passwordConfirm.val()
        }
    }).then((result) => {
        if(result.status === true) {
            // set success alert with message
            let alertMessage = document.createElement("div");
            alertMessage.classList.add("alert", "alert-success");
            alert.val(result.message);
            $('.container-fluid').prepend(alertMessage);

            // hide modal
            $('#dialogVault').modal({show: false});

        } else {
            // show message on modal
            $('#vaultMessage').val(result.message);

            // enable setVaultPassword button
            $('#btnSetVaultPassword').prop("disabled", false);
        }
    });
});

对应的NodeJS (Express) 服务器端代码

router.get('/setup-vault',
    async function (req, res, next) {
        let pass = req.body.password;
        let confirmPass = req.body.passwordConfirm;

        if(pass === undefined || pass === "" ||
            confirmPass === undefined || confirmPass === "") {
            res.json({status: false, message: "Password(s) cannot be empty"});
        }

        if(pass !== confirmPass) {
            res.json({status: false, message: "Keys don't match"});
        } else {
            const vaultHash = vault.encrypt(pass, Buffer.from(settingName.vaultSecret));
            await createOrSaveSetting(settingName.vaultSecret, vaultHash);
            // test connection
            res.json({status: true, message: "Vault created"});
        }
    });

我认为你必须使用 POST 方法来获取正文部分中的数据,如果你使用 GET,就像现在在你的代码中一样,你只能通过 [=34= 获取参数] 查询字符串,你必须像这样使用 POST,你的代码才能工作:

Client-Side

$('#btnSetVaultPassword').click(function () {
    $('#btnSetVaultPassword').prop("disabled", true);

    let password = $('#edtVaultPassword');
    let passwordConfirm = $('#edtVaultPasswordConfirm');

    // const data = ;

    axios({
        method: 'post',
        url: '/setup/setup-vault',
        data: {
            password: password.val(),
            passwordConfirm: passwordConfirm.val()
        }
    }).then((result) => {
        if(result.status === true) {
            // set success alert with message
            let alertMessage = document.createElement("div");
            alertMessage.classList.add("alert", "alert-success");
            alert.val(result.message);
            $('.container-fluid').prepend(alertMessage);

            // hide modal
            $('#dialogVault').modal({show: false});

        } else {
            // show message on modal
            $('#vaultMessage').val(result.message);

            // enable setVaultPassword button
            $('#btnSetVaultPassword').prop("disabled", false);
        }
    });
});

和Server-Side:

router.post('/setup-vault',
    async function (req, res, next) {
        let pass = req.body.password;
        let confirmPass = req.body.passwordConfirm;

        if(pass === undefined || pass === "" ||
            confirmPass === undefined || confirmPass === "") {
            res.json({status: false, message: "Password(s) cannot be empty"});
        }

        if(pass !== confirmPass) {
            res.json({status: false, message: "Keys don't match"});
        } else {
            const vaultHash = vault.encrypt(pass, Buffer.from(settingName.vaultSecret));
            await createOrSaveSetting(settingName.vaultSecret, vaultHash);
            // test connection
            res.json({status: true, message: "Vault created"});
        }
    });

如果您打算使用 GET 方法,您应该在服务器端使用 query string 选项,并将 client-side 更改为使用 params data 在你的 Axios 请求中的位置。