ElementUI上传图片携带token请求头
使用增删改等请求时,我们经常需要在请求中添加请求头headers以进行用户认证。在ElementUI中,其封装了一个action的必选参数,表示上传的请求(地址)。作为初学者,刚开始我一直查找如何在action中传递headers,最后在官方文档查到了解决方案。
一、使用:headers绑定上传的请求头
代码如下(示例):
<el-upload action="http://localhost:8081/blog/uploadAvatar"
:headers="headers"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove">
<i class="el-icon-plus"></i>
<p>更改头像</p>
</el-upload>
二、在computed属性中添加headers信息
data() {
return {
computed: {
headers() {
return {
"Authorization": localStorage.getItem("token")
}
}
}
}
}
三、使用axios收发请求时,携带请求头
edit() {
this.$axios.post("/user/edit", this.form,{
headers: {
"Authorization": localStorage.getItem("token")
}
})
window.location.reload()
}