带有图像的Axios formData发送空数组

时间:2020-10-03 01:20:07

标签: vue.js axios

我在后端的个人资料路由中有一个put方法,我需要令牌身份验证,因此为了获得授权,我必须通过标头传递令牌,但由于某种原因它发送了一个空的formData,因此我得到了一个错误当我在后端记录请求时。

我用邮递员测试了后端,并且一切都按预期工作,所以这不是后端问题,我在前端发出的请求中完全是错误的,但是我不知道如何处理,有什么线索吗?

profile_update() {
            let params = {
                email: this.profile.email,
                password: this.profile.password,
                coin: this.profile.coin,
                phone_country: this.profile.phone_country,
                phone_area: this.profile.area_code,
                phone_number: this.profile.number,
                first_name: this.profile.first_name,
                last_name: this.profile.last_name,
                date_of_birth: this.profile.date_of_birth,
                gender: this.profile.gender,
                city_id: this.profile.city,
                wants_to_change_password: this.profile.wants_to_change_password,
                state_id: this.profile.state,
                city_id: this.profile.city
            }

            let headers = {
                'Authorization': 'Bearer' + this.token
            }

            let formData = new FormData();
            formData.append('profile-picture', this.profile.profile_picture)
            formData.append('data', params)
            formData.append('headers', headers)
            formData.append('_method', 'PUT')

            axios.put(`http://127.0.0.1:8000/api/profile`, formData, headers).then(res => {
                console.log(res)
            }).catch(e => {
                console.log(e)
            })
        }

1 个答案:

答案 0 :(得分:0)

尝试这种方式

axios.put(`http://127.0.0.1:8000/api/profile`, {'profile-picture':this.profile.profile_picture}, {
  headers: {
    Authorization: 'Bearer ' + this.token,
    'content-type': 'multipart/form-data'
  }
}).then(res => {
     console.log(res)
}).catch(e => {
     console.log(e)
})

希望这可以解决您的问题。有关更多信息,请阅读docs