Springboot+vue实现上传文件功能

今天简单实现上传文件功能,上传文件是需要Jar包的。首先我们在pom文件中引入jar包依赖;

                <dependency>
		       <groupId>commons-io</groupId>
			<artifactId>commons-io</artifactId>
			<version>2.4</version>
		</dependency>
		<dependency>
			<groupId>commons-fileupload</groupId>
			<artifactId>commons-fileupload</artifactId>
			<version>1.3.1</version>
		</dependency>

vue前端:

<input type="file" name="upfile" @change="upload"></input>
<button @click="uploadFile">上传文件</button>
        data() {
            return {
                file: ''
            }
        },
        methods: {
            uploadFile(e) {
                let formData = new FormData();
                // 把内容放入到FormData中
                formData.append("upfile", this.file);
                axiosRequest({
                    url: '/api/uploadFile',
                    method: 'post',
                    // 通过data属性将内容携带到后台
                    data: formData,
                    // 设置请求头
                    headers: {
                        "Content-Type" : "multipart/form-data"
                    }
                }).then(res => {
                    if (res.data.status === 200) {
                        this.$notify.success({
                            title: '成功',
                            message: res.data.message
                        });
                    } else if (res.data.status === 400) {
                        this.$notify.error({
                            title: '错误',
                            message: res.data.message
                        });
                    }
                },
                err => {
                    this.$notify.error({
                        title: '错误',
                        message: "上传失败!"
                    });
                });
            },
            upload(e) {
                // 获取input内容
                this.file = e.target.files[0];
            }
        }

后台:

@PostMapping("/uploadFile")
	public ResultMap uploadFile(@RequestParam("upfile") MultipartFile upfile) throws IOException {
		ResultMap resultMap = new ResultMap();
		String originalFilename = upfile.getOriginalFilename();
		String realPath = ResourceUtils.getURL("classpath:").getPath() + "upload";
		File file = new File(realPath, originalFilename);
		if (!file.exists()) {
			try {
				upfile.transferTo(new File(realPath, originalFilename));
				resultMap.setSuccess();
				resultMap.setMessage("上传成功!");
			} catch (IllegalStateException | IOException e) {
				resultMap.setFaild();
				resultMap.setMessage("上传失败!");
				e.printStackTrace();
			}
		} else {
			file.delete();
			try {
				upfile.transferTo(new File(realPath, originalFilename));
			} catch (IllegalStateException | IOException e) {
				e.printStackTrace();
			}
			resultMap.setSuccess();
			resultMap.setMessage("文件替换成功!");
		}
		return resultMap;
	}

 

 

 


版权声明:本文为m0_46608027原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。