在項目中有時會遇到大文件上傳，經常會出現鏈接超時的問題，所以就需要使用文件分片上傳的方式來上傳大文件。實現原理就是，在前端將文件分成指定大小的“文件塊”，分成多次上傳，每次上傳前先向后臺查詢已經上傳成功的文件的大小，然后從指定的位置切割一塊文件，進行上傳，后臺接收到文件塊后追加到指定的文件中。
這篇博客適合有一些后臺基礎的朋友，或者有后臺配合的前端。
這里需要后臺提供兩個接口，一個上傳文件的接口，一個查詢已上傳文件大小的接口。
前端代碼：https://github.com/li5454yong/FileUpload.git
這里放上后臺主要代碼
package com.fs.controller;import java.io.File;import java.io.FileInputStream;import java.io.FileOutputStream;import java.io.FileWriter;import java.io.IOException;import java.io.InputStream;import java.io.RandomAccessFile;import java.util.Iterator;import java.util.Map;import javax.annotation.Resource;import javax.servlet.http.HttpServletRequest;import org.apache.commons.lang3.StringUtils;import org.csource.ClientGlobal;import org.csource.common.MyException;import org.csource.fastdfs.FileInfo;import org.csource.fastdfs.StorageClient;import org.csource.fastdfs.TrackerClient;import org.csource.fastdfs.TrackerServer;import org.junit.Test;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.ResponseBody;import org.springframework.web.multipart.MultipartFile;import org.springframework.web.multipart.MultipartHttpServletRequest;import redis.clients.jedis.Jedis;import redis.clients.jedis.JedisShardInfo;import com.alibaba.fastjson.JSON;import com.fs.entity.UploadedFileInfo;import com.fs.util.UploadUtil;/** * @author admin * * 2016年12月20日下午8:59:38 */@Controllerpublic class FastDFSUpLoadController { @Resource private UploadUtil uploadUtil; @RequestMapping(value = "v1/uploadSize", method = RequestMethod.POST) @ResponseBody public Long uploadSize(HttpServletRequest request) { String name = request.getParameter("name"); Long size = Long.parseLong(request.getParameter("size")); try { JedisShardInfo jedisShardInfo = new JedisShardInfo("192.168.0.12"); Jedis jedis = new Jedis(jedisShardInfo); String str = jedis.get(name); UploadedFileInfo uploadedFileInfo = null; // 如果首次上傳，已上傳大小為 0 if (StringUtils.isEmpty(str)) { uploadedFileInfo = new UploadedFileInfo(); jedis.set(name, JSON.toJSONString(uploadedFileInfo)); jedis.close(); return 0L; } uploadedFileInfo = JSON.parseObject(str, UploadedFileInfo.class); jedis.close(); //已經全部上傳 if(size <= uploadedFileInfo.getSize()){ System.out.println("上傳完成"); } //UploadUtil.getFileInfo(uploadedFileInfo.getFileId()); return uploadedFileInfo.getSize(); } catch (Exception e) { e.printStackTrace(); return 0L; } } @RequestMapping(value = "v1/uploadFile", method = RequestMethod.POST) @ResponseBody public int upload(HttpServletRequest request) { // CommonsMultipartResolver resolver = new // CommonsMultipartResolver(request.getSession().getServletContext()); MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request; Iterator<String> t = multiRequest.getFileNames(); MultipartFile fileDetail = multiRequest.getFile(t.next()); String name = request.getParameter("name"); JedisShardInfo jedisShardInfo = new JedisShardInfo("192.168.0.12"); Jedis jedis = new Jedis(jedisShardInfo); UploadedFileInfo uploadedFileInfo = JSON.parseObject(jedis.get(name), UploadedFileInfo.class); uploadedFileInfo.setFileName(name); String path = "d:/testUpload"; File file = new File(path); if (!file.exists() && !file.isDirectory()) { boolean b = file.mkdirs(); } RandomAccessFile randomFile = null; try { randomFile = new RandomAccessFile(path+"/"+name, "rw"); randomFile.seek(randomFile.length()); randomFile.write(fileDetail.getBytes()); uploadedFileInfo.setLocalPath(path+"/"+name); uploadedFileInfo.setSize(randomFile.length()); } catch (IOException e) { e.printStackTrace(); }finally{ try { randomFile.close(); } catch (IOException e) { e.printStackTrace(); } } // 將上傳文件信息保存到redis jedis.set(name, JSON.toJSONString(uploadedFileInfo)); jedis.close(); return 0; }}以上所述是小編給大家介紹的JS異步文件分片斷點上傳的實現思路，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！
新聞熱點
疑難解答
