spring boot 图片上传

JAVA学习网 2020-11-09 19:16:02

spring boot 图片上传

html页面代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>文件上传</title>
		<!-- 导入Vue -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
		<!-- 导入axios -->
		<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
	</head>
	<body>
		<div id="bigdiv">
		    <input type="file" ref="fileInt" name="file" @change="changeHandle"><br>
			<img :src="imgurl">
		</div>
		<script>
			var vueUpload=new Vue({
				el:'#bigdiv',
				data:{
					imgurl:""
				},
				mounted(){
				},
				methods:{
					changeHandle() {
						const file = this.$refs.fileInt.files[0];
						const data = new FormData();
						data.append('file', file);
						axios({
							method: 'post',
							url: 'http://localhost:8080/upload',
							data,
							headers: {
								'Content-Type': 'multipart/form-data',
							},
						}).then(response => {
							this.imgurl = response.data.data[0];

						}).catch(err => {
							console.log(err);
						});
					}

					}

			})

		</script>
	</body>
</html>

Controller层:

@PostMapping("/upload")
    @ResponseBody
    public imgUploadResult upload(@RequestParam("file") MultipartFile file) {

        //获取文件路径
        String filePath = "F:\\Program Files\\JetBrains\\hadoopWork\\gameStrategy\\src\\main\\resources\\static\\imgUpload\\";
        //获取文件后缀
        String extension = FilenameUtils.getExtension(file.getOriginalFilename());
        //文件名这里使用UUID和时间组成的
        String fileName =  UUID.randomUUID().toString().replace("-","")+
                new SimpleDateFormat("yyyyMMddHHssSSS").format(new Date());

        String newFileName=fileName+"."+extension;

        File dest = new File(filePath + newFileName);
        try {
            file.transferTo(dest);
            List<String> list = new ArrayList<>();

            list.add("/static/imgUpload/" + newFileName);
            System.out.println("上传成功");
            return new imgUploadResult(0,list);
        } catch (IOException e) {
            System.out.println(e.toString());
            return new imgUploadResult(1,null);
        }

    }

pojo层:

package com.example.game.pojo.resqVo;

import com.example.game.model.GsGameInfo;
import lombok.Data;

import java.util.List;
@Data
public class GameInfoResqVo {
    Integer pageCount;
    List<GsGameInfo> gsGameInfoList;
}

配置资源映射路径

@Configuration
public class InterceptorConfig implements WebMvcConfigurer {
    /**
     * 添加静态资源文件,外部可以直接访问地址
     * 资源映射路径
     * addResourceHandler:访问映射路径
     * addResourceLocations:资源绝对路径
     *
     * @param registry
     */
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/static/imgUpload/**").addResourceLocations("file:F:\\Program Files\\JetBrains\\hadoopWork\\gameStrategy\\src\\main\\resources\\static\\imgUpload\\");
    }
}
阅读(2356) 评论(0)