WebKitFormBoundary的解決辦法

put方式更適用於傳輸二進制數據流。

需要將二進制文件流使用put方式發送給后台，起初使用formData方式，但是formData方式會導致上傳后的文件附帶一些不期望的數據：

------WebKitFormBoundaryr8nE5YswiCilf8qB
Content-Disposition: form-data; name="file"; filename="blob"
Content-Type: application/octet-stream

hello world
------WebKitFormBoundaryr8nE5YswiCilf8qB--

上面這個例子里， txt文件里的內容是hello,world，但在上傳后卻生成了開頭一堆，末尾一堆，並且並不是僅txt文件存在這種問題，親測圖片格式上傳后再下載也會如此，
今天筆者查找了好多資料，但是並沒有解決問題，萬般無奈只好一點點摸索，現在講下思路：

筆者的思路起初很簡單，使用formData方式，然后使用formData.append()將二進制文件流放入這個formData對象中，然后在axios請求中的data中將formData填充進去:

        let formData = new FormData();
        formData.append("file",  blobs); //二進制文件流
        axios({
          method: "put",
          url: uploadUrl,
          data: formData,
          headers: {
            "Content-Type": "multipart/form-data", // 關鍵
          },
        })

但是這樣寫就會導致出現上述情況--上傳后無法下載，然后筆者做了一些改進：

//大概思路：放棄formData方式傳輸二進制文件流
axios({
          method: "put",
          url: uploadUrl,
          data:  blobs , // 重點1，直接將原始二進制流賦給data
          headers: {
            "Content-Type": "application/octet-stream", // 重點2
          },
          responseType: "blob", //重點3
})

本質是棄用formData傳輸文件流，而是使用二進制特有文件流格式(content-type)，這樣即可解決簽名文件內WebKitFormBoundaryr8nE5YswiCilf8qB等等等等討厭的問題

以上。