首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
您现在的位置: 程式碼之家 >> 編程語言 >  >> 更多程式語言 >> 程式設計綜合問答

Uploadify 後端實作範例:Spring MVC 控制器寫法

     編輯:程式設計綜合問答

使用 Uploadify 前端上傳插件時,後端需提供一個接收檔案的端點,並回傳 JSON 格式的結果供前端判斷是否成功。以下以 Spring MVC 為例說明關鍵實作步驟:

1. 控制器方法簽名

@PostMapping("/upload")
@ResponseBody
public Map upload(@RequestParam("file") MultipartFile file,
                                    HttpServletRequest request) {
    Map result = new HashMap<>();
    // 業務邏輯...
    return result;
}

2. 核心處理邏輯

  • 檢查檔案是否為空:if (file.isEmpty())。
  • 指定儲存目錄:建議使用獨立目錄(如 /var/upload/),並確保應用程式有寫入權限。
  • 生成唯一檔名:避免衝突,可用 UUID + 原始副檔名。
  • 寫入磁碟:file.transferTo(new File(destPath))。
  • 回傳結果:result.put("success", true); result.put("msg", "上傳成功");。

3. 完整範例程式碼

@PostMapping("/upload")
@ResponseBody
public Map upload(@RequestParam("file") MultipartFile file) {
    Map result = new HashMap<>();
    if (file.isEmpty()) {
        result.put("success", false);
        result.put("msg", "檔案為空");
        return result;
    }
    String uploadDir = "/var/upload/";
    File dir = new File(uploadDir);
    if (!dir.exists()) dir.mkdirs();
    String originalName = file.getOriginalFilename();
    String ext = originalName.substring(originalName.lastIndexOf("."));
    String newName = UUID.randomUUID().toString() + ext;
    File dest = new File(uploadDir + newName);
    try {
        file.transferTo(dest);
        result.put("success", true);
        result.put("msg", "上傳成功");
        result.put("filePath", "/upload/" + newName); // 供前端預覽或下載
    } catch (IOException e) {
        result.put("success", false);
        result.put("msg", "上傳失敗:" + e.getMessage());
    }
    return result;
}

4. 前端 Uploadify 設定重點

$('#file_upload').uploadify({
    'swf'      : '/js/uploadify.swf',
    'uploader' : '/upload',
    'buttonText': '選擇檔案',
    'fileTypeDesc': '所有檔案',
    'fileTypeExts': '*.*',
    'onUploadSuccess' : function(file, data, response) {
        var json = JSON.parse(data);
        if (json.success) {
            alert(json.msg); // 顯示「上傳成功」
        } else {
            alert("錯誤:" + json.msg);
        }
    }
});

更多完整專案原始碼可參考 xlongwei uploadify 範例,其中包含 UploadController 等可直接套用的類別。

  1. 上一篇文章:
  2. 下一篇文章:
Copyright © 程式碼之家 All Rights Reserved