使用tomcat搭建一个本地图片服务器，用Spring Boot工程上传图片并及时显示

一、使用tomcat搭建本地图片服务器

1. 准备一个tomcat服务器：
   
   2.进入conf目录下，修改server.xml文件中的相关端口：

• 停止服务端口8005

		<Server port="8065" shutdown="SHUTDOWN">

• HTTP端口8080

		 <Connector port="8765" protocol="HTTP/1.1"
		               connectionTimeout="20000"
		               redirectPort="8443" />

• AJP端口8009

		<Connector port="8069" protocol="AJP/1.3" redirectPort="8443" />

3. 修改server.xml文件，通过Context配置文件部署图片项目
   
   增加的配置语句：

		<Context path="/img" docBase="E:\img-upload"></Context>

• path：浏览器访问时的路径名前缀；
• docBase：web项目的WebRoot所在的路径，注意是WebRoot的路径，不是项目的路径。这里比较简单，直接就是图片的存储路径。

4. 测试

• 在磁盘E:\img-upload目录下放一张图片

• 启动刚刚的tomcat服务器

• 访问刚刚放入的图片：http://localhost:8765/img/cat.jpeg

如果能够访问到刚刚的图片，说明图片服务器搭建就成功了。

二、使用Spring Boot工程上传图片并及时显示

1. 创建一个简单的spring boot工程，项目结构如下：

2. 导入maven依赖

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-configuration-processor</artifactId>
        </dependency>

3. 编写application.yml 配置文件

server:
  port: 8888 # 修改端口号

# spring boot默认文件上传大小为1MB,这里修改一下文件大小限制
spring:
  servlet:
    multipart:
      max-file-size: 12MB # 单个文件上传大小
      max-request-size: 12MB # 单次请求的文件的总大小

imgupload:
  size: 10485760 # 上传图片大小限制 10M
  path: E:\img-upload # 图片上传路径
  server-prefix: http://localhost:8765/img/ # 图片上传到服务器以后访问图片的url完整前缀

4. 编写UploadConfig文件，读取图片上传的配置信息：

@Component
@ConfigurationProperties(prefix = "imgupload")
public class UploadConfig {

    public Integer size;

    public String path;

    public String serverPrefix;

    public void setSize(Integer size) {
        this.size = size;
    }

    public void setPath(String path) {
        this.path = path;
    }

    public void setServerPrefix(String serverPrefix) {
        this.serverPrefix = serverPrefix;
    }
}

5. 编写一个简易的图片上传工具类，简单校验图片上传

public class ImgUploadUitls {

    /**
     * 允许上传的图片后缀名类型
     */
    public static final List<String> ALL_IMG_TYPE = Arrays.asList(new String[]{".gif", ".png", ".jpeg", ".jpg", ".bmp"});


    /**
     * 判断图片文件扩展名是否合法
     *
     * @param extensionName
     * @return
     */
    public static boolean validateImgType(String extensionName) {
        return ALL_IMG_TYPE.contains(extensionName);
    }

}

6. 编写图片上传UploadController

@RestController
@RequestMapping("/upload")
public class UploadController {
    // 日志对象
    protected static Logger logger = LoggerFactory.getLogger(UploadController.class);

    // 注入图片上传配置对象
    @Autowired
    private UploadConfig uploadConfig;

    /**
     * 上传图片，并访问图片服务器上的图片
     *
     * @param file
     * @param response
     */
    @PostMapping("uploadImg")
    public void uploadImg(@RequestParam("file") MultipartFile file, HttpServletResponse response) {
        try {
            // 判断上传的文件是否为空
            if (file == null || file.isEmpty())
                throw new Exception("上传图片为空!");

            // 判断文件是否超过大小限制
            if (file.getBytes().length > uploadConfig.size)
                throw new Exception("上传图片太大，请不要超过" + (uploadConfig.size / 1024 / 1024) + "M!");

            // 获取文件原始名称
            String originalFilename = file.getOriginalFilename();
            // 获取文件的后缀名
            String extensionName = originalFilename.substring(originalFilename.lastIndexOf("."));

            // 如果文件后缀名合法
            if (!ImgUploadUitls.validateImgType(extensionName))
                throw new Exception("上传图片非法!");

            File pFile = new File(uploadConfig.path);
            // 判断父目录是否存在，不存在就创建
            if (!pFile.exists()) {
                pFile.mkdirs();
            }
            // 生成新的文件名称
            String newFileName = System.currentTimeMillis() + extensionName;
            // 保存图片到本地目录下
            file.transferTo(new File(pFile, newFileName));

            // 图片在图片服务器上的访问url
            String imgUrl = uploadConfig.serverPrefix + newFileName;

            // 重定向，通过图片url用新的页面打开上传的图片
            response.sendRedirect(imgUrl);
            return;

        } catch (Exception e) {
            e.printStackTrace();
            logger.error("图片上传失败!", e);
            // 回写，通知图片上传失败
            response.setContentType("text/html;charset=UTF-8"); // 设置响应类型
            try {
                response.getWriter().write("图片上传失败：" + e.getMessage());
            } catch (IOException ex) {
                logger.error("图片上传失败!", ex);
            }

        }
    }
}

这个实现图片上传的方法比较简陋，还有很多可以完善的地方，代码中带有详细的注释，就不做过多的赘述了。

7. 编写图片上传html页面upload.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片上传</title>
</head>
<body>
<form enctype="multipart/form-data" method="post" action="/upload/uploadImg">
    <input type="file" name="file" value="图片上传">
    <input type="submit" value="点击上传图片">
</form>
</body>
</html>

8. 测试，启动项目，访问：http://localhost:8888/upload.html，进行图片上传

如果自动跳转到上传图片的服务器地址，并显示出图片则说明测试成功