背景:项目做了几个之后,有点好奇图片、视频、文件是怎么通过前端发送请求存储到后端的?平时做的项目就是mysql、redis这些库表设计,然而没有接触到对于图片、视频、文件的存取,接下来针对java springboot,通过前端发送请求,存储文件到后端
1.存储目标
1.1 本地存储
- 将文件上传到本地文件夹
1.2 OSS对象存储
- 将文件上传到云OSS对象存储,在这里用阿里云的OSS
2.1图片
2.1.1图片存储到本地
HTML上传图片代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--上传到本地-->
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit">
</form>
-------------------------------------------------------------
<!--上传到阿里云OSS-->
<form action="/upload/aliyun" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit">
</form>
</body>
</html>
Java的controller层代码:
package com.example.uploadimgprac.controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;
import java.util.Random;
import java.util.UUID;
@RestController
public class UploadImg {
// 图片保存到本地的位置
private static final String ObS_PATH = "E:\\Desktop\\uploadImgPrac\\src\\main\\resources\\images\\";
// 图片保存的格式(这里为了方便,统一转为png保存)
private static final String END = ".png";
/**
* 传图片的方法
* @param file 图片文件
* @return
*/
@PostMapping("/upload")
public String uploadImgByLocal(MultipartFile file) {
// 对传入文件的简单校验
if (file.isEmpty()) {
return "上传失败";
}
// 拼接存储本地的名字 => 为了防止传入图片名字重复,需要自己设置传入图片的名称
String uuid = UUID.randomUUID().toString().replace("-", "");
String newFileName = uuid + END;
try {
// 进行文件的传输
file.transferTo(new File(ObS_PATH + newFileName));
} catch (IOException e) {
throw new RuntimeException(e);
}
// 返回图片存入的绝对路径
return ObS_PATH + newFileName;
}
}
2.1.2图片存储到阿里云OSS
package com.example.uploadimgprac.controller;
import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClientBuilder;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;
import java.util.Random;
import java.util.UUID;
@RestController
public class UploadImg {
// 图片保存到本地的位置
private static final String ObS_PATH = "E:\\Desktop\\uploadImgPrac\\src\\main\\resources\\images\\";
// 图片保存的格式(这里为了方便,统一转为png保存)
private static final String END = ".png";
// 阿里云OSS的地域节点(自己查询)
private static final String END_POINT = "http://***.com";
// 阿里云OSS域名(自己查询)
private static final String BUCKET = "https://***.aliyuncs.com/";
// ak 需要自己查询
private static final String AK = "***";
// sk 需要自己查询
private static final String SK = "***";
/**
* 图片上传到阿里云OSS
* @param file 文件名
* @return 返回存储的路径
*/
@PostMapping("/upload/aliyun")
public String uploadImgByOss(MultipartFile file) {
if (file.isEmpty()) {
return "上传失败";
}
// 拼接存储本地的名字
String uuid = UUID.randomUUID().toString().replace("-", "");
String newFileName = uuid + END;
// 上传到阿里云oss => 导入依赖 => 导入密钥对endpoint + bucket + ak + sk
OSS build = new OSSClientBuilder().build(END_POINT, AK, SK);
// 第一个参数是oss仓库名字
try {
build.putObject("image-upload-wty-121", newFileName, file.getInputStream());
} catch (IOException e) {
throw new RuntimeException(e);
}
// 关闭oss
build.shutdown();
return BUCKET + newFileName;
}
}
2.1.3 注意事项
- 如果提示传入的图片过大而导致异常 => 配置springboot的yml文件即可
spring:
servlet:
multipart:
max-file-size: 10MB