multipartfile上傳

『壹』 Springmvc的幾種多附件上傳方式

1.單文件上傳

1.1、頁面

文件上傳需要將表單的提交方法設置為post，將enctype的值設置為」multipart/form-data」。

<form action="${pageContext.request.contextPath}/test/upload.do" method="post" enctype="multipart/form-data">
<input type="file" name="img"><br />
<input type="submit" name="提交">
</form>
1.2 控制器
@Controller
@RequestMapping("/test")
public class MyController {

@RequestMapping(value = "/upload.do", method = RequestMethod.POST)
// 這里的MultipartFile對象變數名跟表單中的file類型的input標簽的name相同，
//所以框架會自動用MultipartFile對象來接收上傳過來的文件，
//當然也可以使用@RequestParam("img")指定其對應的參數名稱
public String upload(MultipartFile img, HttpSession session)
throws Exception {
// 如果沒有文件上傳，MultipartFile也不會為null，可以通過調用getSize()方法獲取文件的大小來判斷是否有上傳文件
if (img.getSize() > 0) {
// 得到項目在伺服器的真實根路徑，如：/home/tomcat/webapp/項目名/images
String path = session.getServletContext().getRealPath("images");
// 得到文件的原始名稱，如：美女.png
String fileName = img.getOriginalFilename();
// 通過文件的原始名稱，可以對上傳文件類型做限制，如：只能上傳jpg和png的圖片文件
if (fileName.endsWith("jpg") || fileName.endsWith("png")) {
File file = new File(path, fileName);
img.transferTo(file);
return "/success.jsp";
}
}
return "/error.jsp";
}
}
1.3springmvc.xml配置
<!-- 注意：CommonsMultipartResolver的id是固定不變的，一定是multipartResolver，不可修改 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!-- 如果上傳後出現文件名中文亂碼可以使用該屬性解決 -->
<property name="defaultEncoding" value="utf-8"/>
<!-- 單位是位元組，不設置默認不限制總的上傳文件大小，這里設置總的上傳文件大小不超過1M（1*1024*1024） -->
<property name="maxUploadSize" value="1048576"/>
<!-- 跟maxUploadSize差不多，不過maxUploadSizePerFile是限制每個上傳文件的大小，而maxUploadSize是限制總的上傳文件大小 -->
<property name="maxUploadSizePerFile" value="1048576"/>
</bean>
2.多文件上傳

2.1頁面
<form action="${pageContext.request.contextPath}/test/upload.do" method="post" enctype="multipart/form-data">
file 1 : <input type="file" name="imgs"><br />
file 2 : <input type="file" name="imgs"><br />
file 3 : <input type="file" name="imgs"><br />
<input type="submit" name="提交">
</form>
2.2控制器
@Controller
@RequestMapping("/test")
public class MyController {

@RequestMapping(value = "/upload.do", method = RequestMethod.POST)
// 這里的MultipartFile[] imgs表示前端頁面上傳過來的多個文件，imgs對應頁面中多個file類型的input標簽的name，
// 但框架只會將一個文件封裝進一個MultipartFile對象，
// 並不會將多個文件封裝進一個MultipartFile[]數組，直接使用會報[Lorg.springframework.web.multipart.MultipartFile;.<init>()錯誤，
// 所以需要用@RequestParam校正參數（參數名與MultipartFile對象名一致），當然也可以這么寫：@RequestParam("imgs") MultipartFile[] files。
public String upload(@RequestParam MultipartFile[] imgs, HttpSession session)
throws Exception {
for (MultipartFile img : imgs) {
if (img.getSize() > 0) {
String path = session.getServletContext().getRealPath("images");
String fileName = img.getOriginalFilename();
if (fileName.endsWith("jpg") || fileName.endsWith("png")) {
File file = new File(path, fileName);
img.transferTo(file);
}
}
}
return "/success.jsp";
}
}
2.3springmvc.xml配置
<!-- 注意：CommonsMultipartResolver的id是固定不變的，一定是multipartResolver，不可修改 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!-- 如果上傳後出現文件名中文亂碼可以使用該屬性解決 -->
<property name="defaultEncoding" value="utf-8"/>
<!-- 單位是位元組，不設置默認不限制總的上傳文件大小，這里設置總的上傳文件大小不超過1M（1*1024*1024） -->
<property name="maxUploadSize" value="1048576"/>
<!-- 跟maxUploadSize差不多，不過maxUploadSizePerFile是限制每個上傳文件的大小，而maxUploadSize是限制總的上傳文件大小 -->
<property name="maxUploadSizePerFile" value="1048576"/>
</bean>

擴展：
/*
* 通過流的方式上傳文件
* @RequestParam("file") 將name=file控制項得到的文件封裝成CommonsMultipartFile 對象
*/

/*
* 採用file.Transto 來保存上傳的文件
*/

/*
*採用spring提供的上傳文件的方法
*/

『貳』 spring multipartfile 怎麼選擇完文件直接上傳

你文件上傳用的什麼方式，如果是submit直接提交的需要給form加一個屬性：enctype="multipart/form-data"，如果是非同步提交則需要看你的上傳控制項的ID是否正確

『叄』 multipart ile-MultipartFile上傳文件時，中文文件名亂碼怎麼解決

現象:採用smartupload上傳文件時獲取文件名及相關參數()時亂碼.
原因:上傳文件的頁面會以頁面指定的編碼格式對上傳的數據進行編碼,smartupload在接收數據時會以系統默認的編碼解碼上傳數據,如果頁面編碼與系統編碼不一致,則會導致亂碼
解決:
1.指定頁面編碼與系統編碼一致:<meta
http-equiv="Content-Type" content="text/html;
charset=utf-8">,對於windows操作系統應為gbk,對於linux,要指定為export|grep
LANG中一致的編碼格式.
2.修改smartupload.jar中的SmartUpload.java中: String s11 = new
String(m_binArray, m_startData, (m_endData - m_startData) + 1);
和getDataHeader方法中類似部分,加入charSet參數,手動指定編碼
這里已經有修改好的smartupload.jar包,只需在上傳時指定編碼參數即可:su.upload("UTF8");

『肆』 String MultipartFile怎麼實現帶進度條的上傳

MultipartHttpServletRequest multiRequest=(MultipartHttpServletRequest)request;
MultipartFile mulitFile=multiRequest.getFile(fileName);
if(mulitFile.getSize()==0){
throw new DataExistenceException("上傳文件為空！");
}else{
ServletContext context=request.getSession().getServletContext();
//獲得後綴
this.fileType=mulitFile.getOriginalFilename().substring(mulitFile.getOriginalFilename().lastIndexOf(".",mulitFile.getOriginalFilename().length()));
//驗證後綴是否合法
this.picTypeValidate();
//驗證文件（用於不符合文件自己改後綴名）
BufferedImage bufferedImage=ImageIO.read(mulitFile.getInputStream());
if(bufferedImage==null){
throw new DataExistenceException("上傳文件後綴名與類型不符！");
}

『伍』 multipartfile 文件上傳前端怎麼用div和ajax

目前的情況下，沒有直接ajax提交file的可能 有一些js庫你可以使用，他們做的方法往往是在頁面新建一個iframe，然後在frame裡面建一個file的input組件，然後在那個frame裡面走submit 這樣就做成了非同步的樣子，submit那個的form你就可以設置enctype了。
首先要說的就是 ajax 是無法實現上傳文件的，可以想一下ajax與後台通信都是通過傳遞字元串，怎麼能傳遞文件呢？其實出於安全考慮js是不能操作文件的，所以就不要再說用ajax來實現文件的上傳了，這是不可能的。 而本文實現的文件上傳也是無頁面刷。

『陸』 [FE] 用 FormData 上傳多個文件到 MultipartFile[] 介面

最近有一個場景，在提交表單的時候，需要實現添加附件的功能，
表單內容要先提交到服務端，創建一個 issue，然後再將附件添加到這個 issue 中。

所以，附件在用戶添加的時候，是 沒有立即上傳 的，
用戶可以隨意在瀏覽器端添加和刪除，issue 創建後再一起上傳。

前端採用的組件庫是 antd ，用到了 upload 組件。
服務端介面是自定義實現的，也許並不支持 antd upload 上傳組件的規范。

服務端接受數據時，使用了 MultipartFile ，這是 Spring 框架中常用的 寫法 。

我們先看看 html input[type=file] 組件默認行為，

點擊 「選擇文件」，瀏覽器會彈出一個窗口，

選中一個文件，點 「打開」，就會觸發 onchange 事件，

在 onchange 事件中，可以通過 e.target.files[0] 拿到剛才上傳的那個 File 對象 。

再來看一下 upload 組件的默認行為，

點擊 「添加」，瀏覽器也會彈出那個選擇文件的窗口，

選中一個文件，點 「打開」，發現上傳失敗了。

打開控制台，看到 upload 組件向 / 這個地址發送了一個 POST 請求，

數據格式如下，

我們可以向 upload 組件傳入 action 參數，修改 POST 請求地址，

但是，選中文件後立即上傳 不符合 我們的場景，我們需要提交表單之後，將多個文件統一上傳。
所以我們得自定義 upload 組件的行為。

upload 組件的有一個 customRequest 屬性（ #api ），
它可以配置自定義的上傳行為。

我們的思路是，先將選中後自動上傳的行為取消掉，然後再在提交表單後統一上傳。
取消自動上傳 的實現片段如下，

我們只需要在 customRequest 回調中，調用它的 onSuccess 參數即可。

刪除也是可以用的，

現在我們添加兩個附件，

接著來看前端怎樣將這些附件，統一上傳給服務端，具體實現如下，

可以看到請求成功了（項目中的 url 跟本例稍有不同，下圖只為了示意），

還有幾個需要注意的點：

上文 httpClient.post 實際調用了 XMLHttpRequest 發送請求，可能會遇到 跨域 的問題。
所以在調試上傳介面的時候，需要檢查一下服務端的配置，是否支持跨域請求。

CORS 相關的內容大致如下：

在預檢請求階段，服務端對 OPTIONS 請求的響應頭中會包含 Access-Control-Allow-Origin ，

表明服務端接受該域 http://foo.example 的跨域請求。

註：
這里需要後端實現 OPTIONS 方法，後端框架一般會通過配置方式統一處理（返回 200 或 204，不能是 4xx）。
如果未配置統一處理方式，框架可能會直接返回 404 導致預檢請求失敗，CORS 請求也會失敗。

使用 XMLHttpRequest 發送請求時，也可以攜帶 cookie 信息，

同時 預檢請求中服務端響應頭，也要包含 Access-Control-Allow-Credentials ，否則就不會發送 cookie

對於附帶 cookie 的請求，伺服器不能設置 Access-Control-Allow-Origin 的值為 「 * 」，否則請求將會失敗。
而將 Access-Control-Allow-Origin 的值設置為具體的地址 http://foo.example ，請求才能成功。

我們上傳功能用到了攜帶 cookie 的跨域請求，
可以看到服務端響應頭中確實包含了， Access-Control-Allow-Credentials 和 Access-Control-Allow-Origin 兩個欄位。

Spring: Uploading Files
Spring: org.springframework.web.multipart #MultipartFile

ant-design v4.11.1
Ant Design - Upload #API

MDN: CORS

『柒』 MultipartFile文件上傳問題

那是後台寫的邏輯問題，後台判斷到有同名的，覆蓋、不是另建。和前台無關了。

『捌』 MultipartFile上傳文件資料庫保存進了但是target裡面沒有圖片

這里，我只想總結一下我一下午研究文件上傳，圖片上傳功能的思考。也許花費了很多時間，但還是覺得比較值的。

以前一直聽說過「項目使用的所有圖片應該保存在圖片伺服器上，」一直看過這樣的代碼：Java後端由各種流組成的處理圖片或著文件的方法。當時其實都是朦朧的，似懂非懂的樣子。現在或許是有那麼的一點理解了：當項目或者具體說頁面中存在大量的圖片時，頁面的載入可能會很慢，這時，可能就需要使用一個獨立的伺服器來專門的讀取這些圖片了， 所以才有了圖片伺服器的說法。（或許是這樣）。

圖片上傳功能的具體實現（當然文件也一樣）：

總的來說是這樣的， 我們在頁面上通過按鈕獲取到某張圖片後，會顯示在頁面上（如果你需要的話），顯示的可以是圖片本身，或者是圖片的名字。然後通過ajax，把圖片傳到了Java後台，（以什麼格式我還不清楚），根據我這一下午的實踐，MultipartFile ，這個類可以完全接收到前台傳過來的圖片數據。，這里也許有人會問， 傳到後台幹嘛呢。假設你的前端調用的不是你本項目的Java後台代碼，而是另外一個介面Api項目的話， 那麼，其實，這個APi項目就可以當作一個圖片伺服器了。額，這里僅僅是臨時保存了圖片而已，就頁面而言，如果是表單，你還需要提交表單。那麼表單提交時，你還會保存圖片嗎？應該是存圖片在伺服器上的地址吧。

MultipartFile 通過 MultipartFile .transferTo( new File()), 僅需要這步驟，就可以把圖片存到伺服器所在的電腦的任意一個盤或者路徑裡面。 其實這個很簡單，難是難在 文件的創建。（坑了我很久），

new File("d:/test1/test2/test3/demo.png"), 類似要創建這樣的 File文件時， 你要先判斷demo.png 的父級路徑是否存在，如果不存在則要先創建。否則你也許會報一個錯誤，「java.io.FileNotFoundException 拒絕訪問」.

也許廢話說了很多，下面直接上示例代碼， 本實例代碼親測有效可用。本實例 前端採用layui + 後端 springMVC+MultipartFile

頁面.jsp：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
<title>文件上傳demo</title>
<%@include file="/comm/mytags.jsp" %>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>常規使用：普通圖片