Vue获取服务端签名web端直传OSS，各种报错The bucket POST must contain the specified ‘key‘

}).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);

}

});

}

}

}

这里需要注意的是：

如果你遇到了

<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n\n InvalidArgument\n The bucket POST must contain the specified 'key'. If it is specified, please check the order of the fields\n 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 文件路径和大小集合

• @ Param ossClient oss客户端

• @ Param bucketName bucket名称

• @Title: queryAllObject

• @ Description: 查询某个bucket里面的所有文件

*/

public List queryAllObject() {

List 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();

}

}