axios发送get和post请求,前后端如何进行数据交互
方法其实有很多,这里我就各说一种好用的方法。前端:vue;后端:express。
·
方法其实有很多,这里我就各说一种好用的方法。
前端:vue
后端:express
get请求
比方说前端发送了一条这样的get请求
axios.
.get("/URL", {
params: {
username: this.username,
password: this.password,
},
})
.then(function (response) {
console.log(response.data);
})
.catch(function (error) {
console.log(error);
});
对于后端 function(req, res, next),
那么就可以用query接收到params中的数据,可以用类似于
let value = req.query.username;
的语句获取到。
而后端发送的数据则通过res.send();语句发送到前端,前端可以用response的data属性获取数据。
post请求
类似于get请求,前端发送了这样一条post请求
axios.
.post("/URL", {
username: this.username,
password: this.password,
})
.then(function (response) {
console.log(response.data);
})
.catch(function (error) {
console.log(error);
});
首先我们要在后端express文件的app.js文件中引入
var bodyParser = require('body-parser')
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
这样我们才能使用请求的body属性获取前端的数据。
那么同get请求,可以用类似于
let value = req.body.password;
的语句获取数据。
而post请求同样也可以使用res.send();语句发送数据回前端。
那么这两者之间的区别在哪呢。
GET数据容易泄露,POST较为安全。get请求转递的数据一般作为参数来获取后端的数据,它提交的数据是有上限的,一般为2KB,返回值就是请求的数据;而post请求是向指定路径提交数据进行处理,通常用于提交表单或者上传文件,返回值则作为处理结果。
更多推荐
已为社区贡献1条内容
所有评论(0)