最近工作比較忙 , 喜歡上了用有道雲做筆記 , 寫博客就是為了記錄自己的學習的點點滴滴 , 如果能對其他人有幫助當然最好了 , 我一定要將這個習慣進行下去 .. .....
我們以前的前后交互方式一般只有(get 和 post)
只是突然間有個工程師寫了個接收表單的方式的數據 , 忽然就懵逼了 , 死活傳不過去 , 人家也接收不到 , 一直就是格式不對
先復習一下
form表單常用屬性
action：url 地址，服務器接收表單數據的地址
method：提交服務器的http方法，一般為post和get
name：最好好吃name屬性的唯一性
enctype: 表單數據提交時使用的編碼類型，默認使用
"pplication/x-www-form-urlencoded"
，如果是使用POST請求，則請求頭中的content-type指定值就是該值。如果表單中有上傳文件，編碼類型需要使用
"multipart/form-data"
，類型，才能完成傳遞文件數據。
encodeURIComponent 這個方法很有用 , 這個可以轉換特殊字符 , 不過好像是 ''=" 和 空格 轉完是相同的 (我們后台接收解析后是想等的) , 這個我也不太清楚 , 我們是約定好將等號轉換為其他字符解決的 , 取巧了
但是實用 , url會轉換漢字的 但是如果在get帶參數的時候不手動轉 , 特殊字符是不會被轉的 , 比如#號 , 遇到你就知道了
重點是:
post：enctype 默認"application/x-www-form-urlencoded"對表單數據進行編碼，數據以鍵值對在http請求體重發送給服務器；如果enctype 屬性為"multipart/form-data"，則以消息的形式發送給服務器。
但是我們在vue里面直接提交的是一個對象 , 根本不是這個玩意
所以我們要借助node 里面的 qs
qs和JSON 差不多
const Qs = require('qs');
然后把這個東西傳給后端就好了 Qs.stringify(obj) 記得改axios 的請求格式
headers: {
'content-type': '
application/x-www-form-urlencoded'
}
第二種方式 最簡單的方法
var formData = new FormData();
formData.append('dsc',dsc);
formData.append('file',file你的文件對象);