项目场景:
文件上传阿里云OSS,通常情况下的上传方式是页面先文件上传到我们的后台服务器,我们的后台服务器在上传到OSS,这样的话一个文件的上传操作就相当于消耗了两份服务器带宽,
流程图如图所示:
而如果项目的文件或者图片上传业务比较大的话,显然这对服务器来说是一个不必要的开销。
当然,我们也有优化的解决办法,通过服务端给我们生成一个允许我们上传文件到OSS的签名,我们前端项目拿到这个签名去直接上传到OSS,这样就减少了额外的带宽开销,流程图如下所示:
Vue获取服务端签名web端直传OSS
<template> <div class="test"> <div> <input type="file" id="file" name="file" /> <a @click="upload()" href="javascript:;">上传</a> </div> </div> </template> <script> export default { data(){ return { } }, mounted() { this.getOssToken(); }, methods: { //获取上传通行证 getOssToken(){ var _self = this; axios.get('/api/oss/getPolicy').then(function(res){ console.log(res); if(res.data.code == 200){ _self.aliyunOssToken = res.data.data; }else{ _self.$message.error(res.data.message); } }).catch(function(error){ console.log(error); }) }, upload(){ var _self = this; var getSuffix = function (fileName) { var pos = fileName.lastIndexOf("."); var suffix = ''; if (pos != -1) { suffix = fileName.substring(pos); } return suffix; } var file = $("#file").val(); if (file.length == 0) { alert("请选择文件"); } var filename = new Date().getTime() + getSuffix(file); var formData = new FormData(); //注意formData里append添加的键的大小写 formData.append('key', _self.aliyunOssToken.dir + filename); //存储在oss的文件路径 formData.append('OSSAccessKeyId', _self.aliyunOssToken.accessid); //accessKeyId formData.append('policy', _self.aliyunOssToken.policy); //policy formData.append('Signature', _self.aliyunOssToken.signature); //签名 //如果是base64文件,那么直接把base64字符串转成blob对象进行上传就可以了 formData.append("file", $("#file")[0].files[0]); formData.append('success_action_status', 200); //成功后返回的操作码 var url = _self.aliyunOssToken.host; var fileUrl = _self.aliyunOssToken.host +'/'+ _self.aliyunOssToken.dir + filename; $.ajax({ url: url, type: 'POST', data: formData, // async: false, cache: false, contentType: false, processData: false, success: function (data) { console.log(fileUrl); console.log(data); }, error: function (data) { console.log(data); } }); } } } </script>
这里需要注意的是:
如果你遇到了
<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Error>\n <Code>InvalidArgument</Code>\n <Message>The bucket POST must contain the specified 'key'. If it is specified, please check the order of the fields</Message>\n <RequestId>60950F076AD6D5
这种错误的话,那么可能,是你的key字段不存在,这里所有的字段名称一定要和官方文档给定的一致,否则就会报错,注意大小写。
如果不是的话,那么你可能就是遇到了跟我一样的错误,如图所示:
如图所示:
如果还有其他错误,可对照官方文档一步步排查。
Java后台授权代码
这里我也给贴出来吧,省得你再去翻看官方文档了:
有点多,你就看你有用的就行:
package cc.mrbird.febs.external.oss; import cc.mrbird.febs.common.entity.FebsResponse; import cc.mrbird.febs.common.exception.FebsException; import cc.mrbird.febs.common.utils.RandomUtil; import com.aliyun.oss.OSS; import com.aliyun.oss.OSSClientBuilder; import com.aliyun.oss.common.utils.BinaryUtil; import com.aliyun.oss.model.*; import lombok.Data; import org.joda.time.DateTime; import org.springframework.beans.factory.annotation.Value; import org.springframework.stereotype.Service; import org.springframework.web.multipart.MultipartFile; import javax.servlet.http.HttpServletResponse; import java.io.*; import java.net.URLEncoder; import java.nio.charset.StandardCharsets; import java.util.*; /** * @ Author 马超伟 * @ Date 2021-04-30 09:21 * @ Description: * @ Version: */ @Data @Service public class OssFileUpload { @Value("${aliyun.oss.file.endpoint}") private String endpoint; @Value("${aliyun.oss.file.keyid}") private String accessKeyId; @Value("${aliyun.oss.file.keysecret}") private String accessKeySecret; @Value("${aliyun.oss.file.filehost}") private String fileHost; @Value("${aliyun.oss.file.bucketname}") private String bucketName; @Value("${aliyun.oss.file.callbackUrl}") private String callbackUrl; @Value("${aliyun.oss.file.baseDir}") private String dir; public OSS getOssClient() { OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret); ossClient.setBucketAcl(bucketName, CannedAccessControlList.PublicRead); return ossClient; } /** * @ Author: 马超伟 * @ Date: 2021/4/30 10:59 * @ Params: [file, basePath] * @ return: java.lang.String * @ Description: 文件上传 */ public String upload(MultipartFile file, String basePath) { String uploadUrl; try { //判断oss实例是否存在:如果不存在则创建,如果存在则获取 OSS ossClient = getOssClient(); //获取上传文件流 InputStream inputStream = file.getInputStream(); //构建日期路径:avatar/2019/02/26/文件名 String filePath = new DateTime().toString("yyyy/MM/dd"); //文件名:uuid/原始文件名到后缀 String original = file.getOriginalFilename(); String fileName = RandomUtil.getLinkNo(); String newName = fileName + "/" + original; String fileUrl = basePath + "/" + filePath + "/" + newName; //文件上传至阿里云 ossClient.putObject(bucketName, fileUrl, inputStream); // 关闭OSSClient。 ossClient.shutdown(); //获取url地址 uploadUrl = fileHost + "/" + fileUrl; } catch (IOException e) { throw new FebsException("文件上传异常!"); } return uploadUrl; } /** * @return List<String> 文件路径和大小集合 * @ Param ossClient oss客户端 * @ Param bucketName bucket名称 * @Title: queryAllObject * @ Description: 查询某个bucket里面的所有文件 */ public List<String> queryAllObject() { List<String> results = new ArrayList<>(); try { // ossClient.listObjects返回ObjectListing实例,包含此次listObject请求的返回结果。 ObjectListing objectListing = getOssClient().listObjects(bucketName); // objectListing.getObjectSummaries获取所有文件的描述信息。 for (OSSObjectSummary objectSummary : objectListing.getObjectSummaries()) { results.add(" - " + objectSummary.getKey() + " " + "(size = " + objectSummary.getSize() + ")"); } } catch (Exception e) { e.printStackTrace(); } return results; } /** * 从阿里云下载单个文件 * * @ Param objectName */ public void download(String objectName, HttpServletResponse response) { BufferedInputStream input = null; OutputStream outputStream; OSSObject ossObject; try { objectName = objectName.replace(fileHost + "/", ""); response.reset(); response.setCharacterEncoding("utf-8"); response.setContentType("application/x-msdownload"); String substring = objectName.substring(objectName.lastIndexOf("/") + 1); response.addHeader("Content-Disposition", "attachment;filename=" + URLEncoder.encode(substring, "UTF-8")); // ossObject包含文件所在的存储空间名称、文件名称、文件元信息以及一个输入流。 ossObject = getOssClient().getObject(bucketName, objectName); input = new BufferedInputStream(ossObject.getObjectContent()); byte[] buffBytes = new byte[1024]; outputStream = response.getOutputStream(); int read; while ((read = input.read(buffBytes)) != -1) { outputStream.write(buffBytes, 0, read); } input.close(); ossObject.close(); outputStream.close(); } catch (IOException ex) { ex.printStackTrace(); } finally { try { if (input != null) { input.close(); } } catch (IOException e) { // e.printStackTrace(); } } } public void downloadObject(String objectName) { // 创建OSSClient实例。 OSS ossClient = getOssClient(); // 下载Object到本地文件,并保存到指定的本地路径中。如果指定的本地文件存在会覆盖,不存在则新建。 // 如果未指定本地路径,则下载后的文件默认保存到示例程序所属项目对应本地路径中。 objectName = objectName.replace(fileHost + "/", ""); ossClient.getObject(new GetObjectRequest(bucketName, objectName), new File("D:\\localpath\\"+objectName)); // 关闭OSSClient。 ossClient.shutdown(); } /** * 文件及文件夹的递归删除 * * @ Param file */ private static void deleteFile(File file) { if (file.isDirectory()) { File[] files = file.listFiles(); assert files != null; for (File f : files) { deleteFile(f); //将循环后的空文件夹删除 if (f.exists()) { f.delete(); } } } else { file.delete(); } } /** * @ Author: 马超伟 * @ Date: 2021/5/7 18:16 * @ Params: [] * @ return: cc.mrbird.febs.common.entity.FebsResponse * @ Description: 前台获取文件上传签名授权 */ public FebsResponse policy() { //https://gulimall-hello.oss-cn-beijing.aliyuncs.com/hahaha.jpg // callbackUrl为 上传回调服务器的URL,请将下面的IP和Port配置为您自己的真实信息。 // String callbackUrl = "http://88.88.88.88:8888"; String filePath = new DateTime().toString("yyyy/MM/dd"); String dir = "file/" + filePath; // 用户上传文件时指定的前缀。 Map<String, String> respMap = null; try { long expireTime = 30; long expireEndTime = System.currentTimeMillis() + expireTime * 1000; Date expiration = new Date(expireEndTime); PolicyConditions policyConds = new PolicyConditions(); policyConds.addConditionItem(PolicyConditions.COND_CONTENT_LENGTH_RANGE, 0, 1048576000); policyConds.addConditionItem(MatchMode.StartWith, PolicyConditions.COND_KEY, dir); String postPolicy = getOssClient().generatePostPolicy(expiration, policyConds); byte[] binaryData = postPolicy.getBytes(StandardCharsets.UTF_8); String encodedPolicy = BinaryUtil.toBase64String(binaryData); String postSignature = getOssClient().calculatePostSignature(postPolicy); respMap = new LinkedHashMap<>(); respMap.put("accessid", accessKeyId); respMap.put("policy", encodedPolicy); respMap.put("signature", postSignature); respMap.put("dir", dir); respMap.put("host", fileHost); respMap.put("expire", String.valueOf(expireEndTime / 1000)); // respMap.put("expire", formatISO8601Date(expiration)); } catch (Exception e) { // Assert.fail(e.getMessage()); System.out.println(e.getMessage()); } return new FebsResponse().success().put("data", respMap); } }
总结
遇到问题并不可怕,可怕的是找不出来问题在哪, 这种调用人家方法的,就按照人家的要求一步步走就行了,自己的任何‘**投机取巧、标新立异’**都是行不通的。
找到报错信息,去官方文档查阅‘常见问题’,解决起来就轻松多了。