🎉
【音声ファイルアップロード機能】filesオブジェクトからを配列を指定してformDataのパラメータにセット(アップロード成功)
consoleで以下エラーが出てた
TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them
at Function.r (<anonymous>:1:83)
原因
filesオブジェクトは本来複数のファイルを配列として、オブジェクトに格納して同時にアップロードできる
laravelのapi側がそれを想定してなくてエラーが出てた
解決
filesオブジェクトからを配列を指定してformDataのパラメータにセットする
async uploadMusicFile () {
let formData = new FormData();
formData.append('music_file', this.musicFile);
formData.append('cover_image', this.coverImages[0]); // ここ
formData.append('title', this.musicFileName);
formData.append('genre', this.genre);
formData.append('emotions', this.emotion);
formData.append('user_id', '0'); //後にauthのidをセットする
let config = {
headers: {
'content-type': 'multipart/form-data',
// 'Access-Control-Allow-Origin': '*',
// 'Access-Control-Allow-Headers': '*',
'contentType': false,
'processData': false
},
};
await this.$axios.post('api/musicFileUpload', formData, config)
.then(res => {
console.log(res)
this.posts = res.data.posts
console.log(this.posts)
this.closeAfterMusicUploadModal()
location.reload();
})
.catch(err => {
console.log(err)
})
},
無事アップロード成功
参考
Discussion