没有 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 请求中的位置。
我有一个注册页面,用户需要在其中确认密码。为此,我创建了以下 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 请求中的位置。