首先文件上傳首先想到的發post，當然還有其他的上傳協議，我們這里只介紹發post。
post支持四種content-type:
Content-Type 被指定為 application/x-www-form-urlencoded；其次，提交的數據按照 key1=val1&key2=val2 的方式進行編碼，key 和 val 都進行了 URL 轉碼。
首先生成了一個 boundary 用於分割不同的欄位，為了避免與正文內容重復，boundary 很長很復雜。然後 Content-Type 里指明了數據是以 mutipart/form-data 來編碼，本次請求的 boundary 是什麼內容。消息主體里按照欄位個數又分為多個結構類似的部分，每部分都是以 --boundary 開始，緊接著內容描述信息，然後是回車，最後是欄位具體內容（文本或二進制）。如果傳輸的是文件，還要包含文件名和文件類型信息。消息主體最後以 --boundary-- 標示結束。
RFC1867
application/json這個Content-Type都比較熟悉，當然也可以把json放到formData中；
RFC4657
參見RFC，也比較常見。
XML-RFC
在HTML中要有一個包含了文件輸入框的form元素，表單里元素的name一定要寫，最終形成formData時，是以name作為key值
如果直接在form里寫action的話，會刷新表單，同步請求。所以用發送非同步post請求方式。
你還可以不藉助HTML表單,直接向FormData對象中添加一個File對象或者一個Blob對象:
你還可以使用jQuery來發送FormData,但必須要正確的設置相關選項:
MDN：使用FormData
B. 現在做網頁前端的學習路線是什麼
初學者必看干貨web前端學習路線圖，隨著移動互聯網的發展，web前端逐漸受到企業的重視，前端開發人員的薪資也水漲船高，越來越多的人看好前端行業的發展，想要轉行加入。下面，給大家分享一份web前端學習路線圖，希望對初學者有所幫助。
Web前端行業的發展，讓前端人員能完成比以前更多的職責范圍，所以未來前端可以寬口徑就業，前景非常好。除此之外，目前web前端工程師日均崗位缺口超50000，平均薪資10820元/月。
對於零基礎的人而言，要怎麼學習web前端呢？
1、前端頁面重構。主要內容為PC端網站布局、Photoshop工具及切圖、H5移動端網頁布局、HTML5+CSS3新特性與交互。學習目標是完成PC端網站布局，可實現響應式布局，一套代碼適配PC端、移動端、平板設備等。
2、前後端網頁交互。主要內容為JavaScript語法全面進階、ES6到ES10新語法實踐、jQuery應用及插件使用、設計模式及插件編寫、封裝JS工具庫及WebAPIS、AJAX+PHP+MySQL前後端交互、前端工程化與模塊化應用以及PC端全棧開發項目等。學習目標是可以掌握前端工程化工具，如git、gulp、webpack等，搭建項目及開發項目。
3、Node.js+前端框架。主要內容為Node.js全面進階、Koa2+MongoDB搭建服務、Vue.js框架、React.js框架、小程序雲開發與小程序框架、原生APP與混合APP、數據可視化與桌面應用等。學習目標是掌握桌面應用及可視化大數據，實現復雜數據展示類項目，能夠獨立完成前後台相關功能，勝任HTML5全棧開發工程師職位。
很多學習web前端的朋友都希望在學成後能找到一份滿意的工作，所以我們在學習過程中一定要注意實戰經驗的積累，如果你所學的東西對企業沒有用，那你所做的一切都是無用功。
C. 前端做input表單，type=file怎樣提交給後台
1、首先，你要對form表單設置下相關屬性，增加如下屬性：
enctype="multipart/form-data" action="接收上傳文件的後台處理URL" method="post"
<form enctype="multipart/form-data" action="" method="post">
<input type="file" <a href="https://www..com/s?wd=id&tn=44039180_cpr&fenlei=-bIi4WUvYETgN-" target="_blank" class="-highlight">id</a>="choosefile" />
<input type="file" <a href="https://www..com/s?wd=id&tn=44039180_cpr&fenlei=-bIi4WUvYETgN-" target="_blank" class="-highlight">id</a>="f" style="display:none;" />
<input type="submit" value="上傳文件" <a href="https://www..com/s?wd=id&tn=44039180_cpr&fenlei=-bIi4WUvYETgN-" target="_blank" class="-highlight">id</a>="submitBtn" />
</form>
2、編寫接收客戶端文件上傳的後台代碼，即上面提到的「接收上傳文件的後台處理URL」的相關代碼。
3、當點擊上面增加的「上傳文件」按鈕後，將調用action對應的處理方法進行文件上傳
因為不知道你是使用什麼語句作為後台程序的運行語句，這里沒法給出示例。像很多都有現成的插件。
D. 前端上傳文件的幾種方法
1.表單上傳
最傳統的圖片上傳方式是form表單上傳，使用form表單的input[type=」file」]控制項，打開系統的文件選擇對話框，從而達到選擇文件並上傳的目的。
form表單上傳
表單上傳需要注意以下幾點：
(1).提供form表單，method必須是post。
(2).form表單的enctype必須是multipart/form-data。
javascript學習交流群：453833554
enctype 屬性規定在發送到伺服器之前應該如何對表單數據進行編碼。默認地，表單數據會編碼為 "application/x-www-form-urlencoded"。就是說，在發送到伺服器之前，所有字元都會進行編碼。HTML表單如何打包數據文件是由enctype這個屬性決定的。enctype有以下幾種取值：
application/x-www-form-urlencoded：在發送前編碼所有字元(默認)(空格被編碼為』+』，特殊字元被編碼為ASCII十六進制字元)。
multipart/form-data：不對字元編碼。在使用包含文件上傳控制項的表單時，必須使用該值。
text/plain：空格轉換為 「+」 加號，但不對特殊字元編碼。
默認enctype=application/x-www-form-urlencoded，所以表單的內容會按URL規則編碼，然後根據表單的提交方法：
method=』get』 編碼後的表單內容附加在請求連接後，
method=』post』 編碼後的表單內容作為post請求的正文內容。
E. multipartfile 文件上傳前端怎麼用div和ajax
目前的情況下，沒有直接ajax提交file的可能 有一些js庫你可以使用，他們做的方法往往是在頁面新建一個iframe，然後在frame裡面建一個file的input組件，然後在那個frame裡面走submit 這樣就做成了非同步的樣子，submit那個的form你就可以設置enctype了。
首先要說的就是 ajax 是無法實現上傳文件的，可以想一下ajax與後台通信都是通過傳遞字元串，怎麼能傳遞文件呢？其實出於安全考慮js是不能操作文件的，所以就不要再說用ajax來實現文件的上傳了，這是不可能的。 而本文實現的文件上傳也是無頁面刷。
F. 求大神前端名詞解釋：URL、路徑、地址、域名，最好能舉例說明
這幾個詞除了url和域名指代非常明確，其他都是翻譯的所以有時會有混用的情況——比如A書里說的地址，有可能就是B書里說的url或者路徑，但是一般來說解釋如下：
url是資源地址——格式如下：
協議://用戶名:密碼@子域名.域名.頂級域名:埠號/目錄/文件名.文件後綴?參數=值#標志
比如：
http://www..com/
file:///C:/Users/computer/Desktop/abcd.pdf
http://192.168.0.1:8080/abcd/a.php?file=abcd
路徑一般指文件路徑，分為相對路徑和絕對路徑：
相對路徑：../images/a.jpg
絕對路徑：C:\
地址一般說的是ip地址：
192.168.0.1
域名說的是由綁定了ip地址，由DNS解析的別名，通俗的說就是我們訪問網站的根網址比如：
www..com
這就是一個域名