使用FormData上傳文件時,總是獲取不到req.file對象。發現是沒有配置對FormData導致。
這里我是在vue中使用axios發送的請求,配置代碼如下。重點地方給出注釋
<form id="uploadform" method="POST" enctype="multipart/form-data" :action="postImgApi" ref="uploadform"> <input type="file" name="imagefile" @change="upload" ref="inputfile"></form>let uploadform = this.$refs.uploadformlet inputfile = this.$refs.inputfilelet formData = new FormData(uploadform) //初始化時將form Dom對象傳入formData.append('imagefile', inputfile) //將imagefile鍵追加進去,值為input-file的dom對象,否則服務端無法獲取filethis.$http.post(this.postImgApi, formData, { headers: { 'Content-Type': 'multipart/form-data' //設置post文件的請求頭 }}).then(res => { debugger this.textarea = res.data})這兩天也是從網上找了各種demo和資料,發現使用自己的請求是后臺就是獲取不到文件,而使用form表單的submit卻是可以。最開始分析是否是自己的請求頭的問題,發現content-type正確且帶有boundary,content-length也正常,說明請求頭這里應該是沒問題的。所以從FormData這里入手,幾次嘗試后尋找到上面代碼的方式可以正常運行。這里后面有時間還是要詳細分析下FormData,好好學習下在給出深度的解釋。
以上所述是小編給大家介紹的JS FormData上傳文件的設置方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!
新聞熱點
疑難解答