Spring MVC + EasyUI 實現文件上傳至服務器

後端實現（Controller）

使用 CommonsMultipartResolver 解析 multipart 請求，保存文件到指定目錄：

@RequestMapping("/uploadFile")
public String uploadFile(HttpServletRequest request, HttpServletResponse response, Model model, RedirectAttributes attr) throws IOException {
    CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(request.getSession().getServletContext());
    if (multipartResolver.isMultipart(request)) {
        MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;
        Iterator iter = multiRequest.getFileNames();
        while (iter.hasNext()) {
            MultipartFile file = multiRequest.getFile(iter.next());
            if (file != null && file.getSize() > 0) {
                // 限制文件大小（如 40MB）
                if (file.getSize() > 40 * 1024 * 1024) {
                    return "overMaxSize";
                }
                String originalName = file.getOriginalFilename();
                String ext = originalName.substring(originalName.lastIndexOf("."));
                String storeName = System.currentTimeMillis() + ext;
                // 構建保存路徑：BASE_PATH/yyyyMM/
                File saveDir = new File(BASE_PATH + new SimpleDateFormat("yyyyMM").format(new Date()));
                if (!saveDir.exists()) saveDir.mkdirs();
                File dest = new File(saveDir, storeName);
                try {
                    file.transferTo(dest); // 保存文件
                    // 可在此記錄數據庫：文件名、路徑、上傳時間等
                } catch (Exception e) {
                    e.printStackTrace();
                    throw new ServiceException("文件保存失敗", e);
                }
            }
        }
    }
    return "success";
}

前端頁面（EasyUI）

使用 <input type="file"> 配合 form 表單提交，或 EasyUI 的 filebox 組件：

<form id="uploadForm" method="post" enctype="multipart/form-data" action="/uploadFile">
    <input type="file" name="file" id="file" />
    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()">上傳</a>
</form>

<script>
function submitForm() {
    $('#uploadForm').form('submit', {
        onSubmit: function() {
            return $(this).form('validate');
        },
        success: function(data) {
            if (data === 'success') {
                $.messager.alert('提示', '上傳成功');
            } else {
                $.messager.alert('錯誤', '上傳失敗：' + data);
            }
        }
    });
}
</script>

關鍵配置

• Spring 配置 multipartResolver Bean（或由 Spring Boot 自動配置）。
• 表單必須設置 enctype="multipart/form-data"。
• 文件大小限制可在 multipartResolver 中配置 maxUploadSize。

參考資源

更多上傳示例可參考：Spring MVC 文件上傳詳解