# spring-boot-starter-upload

**Repository Path**: feege/spring-boot-starter-upload

## Basic Information

- **Project Name**: spring-boot-starter-upload
- **Description**: spring-boot-starter-upload
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2022-12-10
- **Last Updated**: 2023-11-30

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

 **后台：安装依赖** 
<dependency>
    <groupId>bw-springboot-starter</groupId>
    <artifactId>spring-boot-starter-upload</artifactId>
    <version>1.0-SNAPSHOT</version>
</dependency> 
 **添加配置** 
file.enable=true
file.path=/home/pic/
file.domain=http://localhost:${server.port}/
 **文件上传** 
@Autowired
private FileService fileService;

@RequestMapping("postFileUpload")
public ResponseResult postFileUpload(@ModelAttribute Chunk chunk) throws InterruptedException {
	fileService.postFileUpload(chunk);
	if (chunk.getTotalChunks().equals(chunk.getChunkNumber())) {
		TimeUnit.SECONDS.sleep(2);
		FileResult fileResult = fileService.mergeFile(chunk);
		return ResponseResult.success(fileResult);
	}
	log.info("文件上传成功");
	return ResponseResult.success(null);
}

 **前端,安装vue文件上传插件，md5插件** 
https://www.npmjs.com/package/vue-simple-uploader
npm install vue-simple-uploader spark-md5
main.js添加如下
import uploader from 'vue-simple-uploader'
Vue.use(uploader);

 **vue页面** 
import SparkMD5 from 'spark-md5';
<el-form-item label="大文件上传">
	<uploader :options="options" class="uploader-example"
			  @file-added="onFileAdded">
		<uploader-unsupport></uploader-unsupport>
		<uploader-drop>
			<p>Drop files here to upload or</p>
			<uploader-btn>select files</uploader-btn>
			<uploader-btn :attrs="attrs">select images</uploader-btn>
			<uploader-btn :directory="true">select folder</uploader-btn>
		</uploader-drop>
		<uploader-list></uploader-list>
	</uploader>
</el-form-item>

 **data配置** 
options: {
	target: baseUrl+'file/postFileUpload', // 目标上传 URL
	chunkSize: '2048000',   //分块大小
	fileParameterName: 'file', //上传文件时文件的参数名，默认file
	maxChunkRetries: 3,  //最大自动失败重试上传次数
	testChunks: false,     //是否开启服务器分片校验
}
 **methods方法，MD5对文件签名** 
onFileAdded(file) {
	const fileReader = new FileReader()
	fileReader.readAsBinaryString(file);
	fileReader.onload = e => {
		const md5 = SparkMD5.hashBinary(e.target.result);
		console.log(md5);
		file.uniqueIdentifier = md5;
	}
}
![输入图片说明](https://foruda.gitee.com/images/1663520689805067453/29506539_782567.png "屏幕截图")