JS FormData上傳文件的設(shè)置方法
使用FormData上傳文件時(shí),總是獲取不到req.file對(duì)象。發(fā)現(xiàn)是沒有配置對(duì)FormData導(dǎo)致。
這里我是在vue中使用axios發(fā)送的請(qǐng)求,配置代碼如下。重點(diǎn)地方給出注釋
<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.uploadform let inputfile = this.$refs.inputfile let formData = new FormData(uploadform) //初始化時(shí)將form Dom對(duì)象傳入 formData.append('imagefile', inputfile) //將imagefile鍵追加進(jìn)去,值為input-file的dom對(duì)象,否則服務(wù)端無法獲取file this.$http.post(this.postImgApi, formData, { headers: { 'Content-Type': 'multipart/form-data' //設(shè)置post文件的請(qǐng)求頭 } }).then(res => { debugger this.textarea = res.data })
這兩天也是從網(wǎng)上找了各種demo和資料,發(fā)現(xiàn)使用自己的請(qǐng)求是后臺(tái)就是獲取不到文件,而使用form表單的submit卻是可以。最開始分析是否是自己的請(qǐng)求頭的問題,發(fā)現(xiàn)content-type正確且?guī)в衎oundary,content-length也正常,說明請(qǐng)求頭這里應(yīng)該是沒問題的。所以從FormData這里入手,幾次嘗試后尋找到上面代碼的方式可以正常運(yùn)行。這里后面有時(shí)間還是要詳細(xì)分析下FormData,好好學(xué)習(xí)下在給出深度的解釋。
以上所述是小編給大家介紹的JS FormData上傳文件的設(shè)置方法,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
JS實(shí)現(xiàn)勻加速與勻減速運(yùn)動(dòng)的方法示例
這篇文章主要介紹了JS實(shí)現(xiàn)勻加速與勻減速運(yùn)動(dòng)的方法,涉及javascript結(jié)合時(shí)間函數(shù)與數(shù)學(xué)運(yùn)算動(dòng)態(tài)操作頁面元素樣式的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-09-09JS使用canvas實(shí)現(xiàn)基本的截圖功能
這篇文章主要給大家介紹了使用JS中的canvas實(shí)現(xiàn)基本的截圖功能,文中有詳細(xì)的實(shí)現(xiàn)思路和實(shí)現(xiàn)過程,文章通過代碼示例講解的非常詳細(xì),很感興趣的同學(xué)可以參考一下2023-08-08JavaScript實(shí)現(xiàn)文本目標(biāo)字符替換和一鍵全部替換
這篇文章主要介紹了JavaScript實(shí)現(xiàn)文本目標(biāo)字符替換和一鍵全部替換,文章圍繞主題展開詳細(xì)的內(nèi)容介紹,具有一定的參考價(jià)值,需要的小伙伴可以參考一下2022-06-06JS+CSS實(shí)現(xiàn)帶關(guān)閉按鈕DIV彈出窗口的方法
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)帶關(guān)閉按鈕DIV彈出窗口的方法,實(shí)例分析了div彈出層窗口的實(shí)現(xiàn)技巧,非常具有實(shí)用價(jià)值,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02js中文逗號(hào)轉(zhuǎn)英文實(shí)現(xiàn)
中文逗號(hào)如何轉(zhuǎn)英文,下面為大家詳細(xì)介紹下,感興趣的朋友不要錯(cuò)過2014-02-02JavaScript如何實(shí)現(xiàn)在線預(yù)覽HTML文件功能
實(shí)現(xiàn)瀏覽器在線預(yù)覽文件的方法有很多種,這篇文章主要介紹了JavaScript如何實(shí)現(xiàn)在線預(yù)覽HTML文件功能的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2025-05-05uniApp實(shí)現(xiàn)選擇時(shí)間功能
這篇文章主要介紹了uniApp實(shí)現(xiàn)選擇時(shí)間功能,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-03-03JavaScript清空數(shù)組元素的兩種方法簡(jiǎn)單比較
這篇文章主要介紹了JavaScript清空數(shù)組元素的兩種方法簡(jiǎn)單比較,羅列了幾種常見的情況javascript數(shù)組的方法,并且比較了其中的兩種常見方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07淺談layui 綁定form submit提交表單的注意事項(xiàng)
今天小編就為大家分享一篇淺談layui 綁定form submit提交表單的注意事項(xiàng),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-10-10