使用vue改造servlet项目遇到formdata数据;使用axios发送formdata数据
程序员文章站
2022-06-22 08:11:10
在原来项目中我发现使用原生的html发送的请求是放在formdata下面的而在axios中默认将数据放到payload下面,这时候我们就需要将数据放到formdata下面login: function () { var formData = new FormData(); formData.append("username", this.username); formData.append("pas...
在原来项目中我发现使用原生的html发送的请求是放在formdata下面的
而在axios中默认将数据放到payload下面,这时候我们就需要将数据放到formdata下面
login: function () {
axios({
url: 'login',
method: 'post',
data: {
username: this.username,
password: this.password
},
//重点
transformRequest: [
function (data) {
let ret = '';
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
ret = ret.substring(0, ret.lastIndexOf('&'));
return ret
}
],
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
//重点
}).then(res => {
if (res.data.code === 0){
window.location.href = "index.jsp"
}else {
alert("登录失败")
}
})
}
这样一转换,后台的servlet就可以收到数据了
方法二:
login: function () {
var formData = new URLSearchParams();
formData.append("username", this.username);
formData.append("password", this.password);
axios({
url: 'login',
method: 'post',
data: formData,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}).then(res => {
if (res.data.code === 0){
window.location.href = "index.jsp"
}else {
alert("登录失败")
}
})
vue-resourse:
在请求时设置emulateJSON:true
login: function () {
this.$http.post('login', {
username: this.username,
password: this.password
},{emulateJSON:true}).then(function (data) {
if (data.data.id == 1) {
window.location.href="index.jsp";
} else {
alert(data.data.message);
}
}, function () {
console.log('传输失败');
});
}
本文地址:https://blog.csdn.net/qq_41968029/article/details/107877942
上一篇: Android优化笔记--内存优化