Spring Boot(三)—— OSS服务端签名后直传并回调

caroly 2020年08月18日 84次浏览

基于『Post Policy』的使用规则在服务端通过『Java』代码完成签名,并且设置上传回调,然后通过表单直传数据到『OSS』。

通过此方案,可以知道用户上传了哪些文件以及文件名;如果上传了图片,还可以知道图片的大小等。


OSS 相关概念

  • Endpoint:访问域名,通过该域名可以访问OSS服务的API,进行文件上传、下载等操作。
  • Bucket:存储空间,是存储对象的容器,所有存储对象都必须隶属于某个存储空间。
  • Object:对象,对象是OSS存储数据的基本单元,也被称为OSS的文件。
  • AccessKey:访问密钥,指的是访问身份验证中用到的 AccessKeyId 和 AccessKeySecret。

流程介绍

流程如下图所示:

OSS服务端签名流程图

当用户要上传一个文件到『OSS』,而且希望将上传的结果返回给应用服务器时,需要设置一个回调函数,将请求告知应用服务器。用户上传完文件后,不会直接得到返回结果,而是先通知应用服务器,再把结果转达给用户。


前提条件

  • 应用服务器对应的域名可通过公网访问。
  • 应用服务器已经按照Java 1.6 以上版本。
  • PC端浏览器支持JavaScript。

Spring Boot整合OSS

添加依赖

在pom.xml中添加如下依赖:

<dependency>
    <groupId>com.aliyun.oss</groupId>
    <artifactId>aliyun-sdk-oss</artifactId>
    <version>2.8.3</version>
</dependency>

修改配置文件

在『application.properties』中添加如下配置:

aliyun.oss.endpoint=post-test.oss-cn-heyuan.aliyuncs.com
aliyun.oss.accessKeyId=<yourAccessKeyId>
aliyun.oss.accessKeySecret=<yourAccessKeySecret>
aliyun.oss.bucketName=post-test
#签名有效时间
aliyun.oss.policy.expire=60
#单个文件上传最大值mb
aliyun.oss.maxSize=20
#回调地址
aliyun.oss.callback=http://ip:port/aliyun/oss/callback
#目录
aliyun.oss.dir.prefix=directory/

注:callback需要的是公网可以访问的IP地址。


添加OSS的相关Java配置

import com.aliyun.oss.OSSClient;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

@Configuration
public class OssConfig {
    @Value("${aliyun.oss.endpoint}")
    private String ALIYUN_OSS_ENDPOINT;
    @Value("${aliyun.oss.accessKeyId}")
    private String ALIYUN_OSS_ACCESSKEYID;
    @Value("${aliyun.oss.accessKeySecret}")
    private String ALIYUN_OSS_ACCESSKEYSECRET;
    @Bean
    public OSSClient ossClient(){
        return new OSSClient(ALIYUN_OSS_ENDPOINT,ALIYUN_OSS_ACCESSKEYID,ALIYUN_OSS_ACCESSKEYSECRET);
    }
}

添加OSS上传成功后的回调参数对象

import lombok.Data;

@Data
public class OssCallbackParam {
    //请求的回调地址
    private String callbackUrl;
   //回调是传入request中的参数
    private String callbackBody;
   //回调时传入参数的格式,比如表单提交形式
    private String callbackBodyType;
}

封装返回类型

public class Constants {
    public final static String RESCODE_SUCCESS = "100";
    public final static String RESMSG_SUCCESS = "成功";

    public final static String RESCODE_SIGNATION_FAILED = "101";
    public final static String RESMSG_SIGNATION_FAILED = "生成签名失败";
}
public class ResultBean {

    private String resCode;
    private String resMsg;
    private Object resultContent;

    public ResultBean(String resCode, String resMsg){
        this.resCode = resCode;
        this.resMsg = resMsg;
    }

    public ResultBean(String resCode, String resMsg, Object resultContent){
        this.resCode = resCode;
        this.resMsg = resMsg;
        this.resultContent = resultContent;
    }
    public ResultBean(){}

    public String getResCode() {
        return resCode;
    }
    public void setResCode(String resCode) {
        this.resCode = resCode;
    }
    public String getResMsg() {
        return resMsg;
    }
    public void setResMsg(String resMsg) {
        this.resMsg = resMsg;
    }
    public Object getResultContent() {
        return resultContent;
    }
    public void setResultContent(Object resultContent) {
        this.resultContent = resultContent;
    }

    @Override
    public String toString() {
        return "ResultBean{" +
                "resCode='" + resCode + '\'' +
                ", resMsg='" + resMsg + '\'' +
                ", resultContent=" + resultContent +
                '}';
    }
}

添加OSS业务接口及其实现

public interface OssBiz {
    ResultBean getPolicy();

    ResultBean callback(HttpServletRequest request);
}
import cn.hutool.json.JSONObject;
import cn.hutool.json.JSONUtil;
import com.aliyun.oss.OSSClient;
import com.aliyun.oss.common.utils.BinaryUtil;
import com.aliyun.oss.model.MatchMode;
import com.aliyun.oss.model.PolicyConditions;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;

import javax.servlet.http.HttpServletRequest;
import java.util.Date;

@Service
public class OssBizImpl implements OssBiz {
    private static final Logger LOGGER = LoggerFactory.getLogger(OssBizImpl.class);
    @Value("${aliyun.oss.policy.expire}")
    private String ALIYUN_OSS_EXPIRE;
    @Value("${aliyun.oss.maxSize}")
    private String ALIYUN_OSS_MAX_SIZE;
    @Value("${aliyun.oss.callback}")
    private String ALIYUN_OSS_CALLBACK;
    @Value("${aliyun.oss.bucketName}")
    private String ALIYUN_OSS_BUCKET_NAME;
    @Value("${aliyun.oss.endpoint2}")
    private String ALIYUN_OSS_ENDPOINT;
    @Value("${aliyun.oss.dir.prefix}")
    private String ALIYUN_OSS_DIR_PREFIX;

    @Autowired
    private OSSClient ossClient;

    @Autowired
    private ProductMapper productMapper;

    @Override
    public ResultBean getPolicy() {
        JSONObject resultBean = new JSONObject();
        // 存储目录
        String dir = ALIYUN_OSS_DIR_PREFIX;
        // 签名有效期
        long expireEndTime = System.currentTimeMillis() + Integer.parseInt(ALIYUN_OSS_EXPIRE) * 1000;
        Date expiration = new Date(expireEndTime);
        // 文件大小
        long maxSize = Integer.parseInt(ALIYUN_OSS_MAX_SIZE) * 1024 * 1024;
        // 回调
        OssCallbackParam callback = new OssCallbackParam();
        callback.setCallbackUrl(ALIYUN_OSS_CALLBACK);
        // callback 内容采用的是Base64编码。经过Base64解吗后的内容如下:
        callback.setCallbackBody("filename=${object}&size=${size}&mimeType=${mimeType}&height=${imageInfo.height}&width=${imageInfo.width}");
        callback.setCallbackBodyType("application/x-www-form-urlencoded");
        // 提交节点
        String action = "https://" + ALIYUN_OSS_ENDPOINT;
        try {
            PolicyConditions policyConds = new PolicyConditions();
            policyConds.addConditionItem(PolicyConditions.COND_CONTENT_LENGTH_RANGE, 0, maxSize);
            policyConds.addConditionItem(MatchMode.StartWith, PolicyConditions.COND_KEY, dir);
            String postPolicy = ossClient.generatePostPolicy(expiration, policyConds);
            byte[] binaryData = postPolicy.getBytes("utf-8");
            String policy = BinaryUtil.toBase64String(binaryData);
            String signature = ossClient.calculatePostSignature(postPolicy);
            String callbackData = BinaryUtil.toBase64String(JSONUtil.parse(callback).toString().getBytes("utf-8"));
            resultBean.put("accessid",ossClient.getCredentialsProvider().getCredentials().getAccessKeyId());
            resultBean.put("policy",policy);
            resultBean.put("signature",signature);
            resultBean.put("dir",dir);
            resultBean.put("expire",String.valueOf(expireEndTime / 1000));
            resultBean.put("callback",callbackData);
            resultBean.put("host",action);
            // 返回结果
        } catch (Exception e) {
            LOGGER.error("签名生成失败", e);
            return new ResultBean(Constants.RESCODE_SIGNATION_FAILED,Constants.RESMSG_SIGNATION_FAILED);
        }
        return new ResultBean(Constants.RESCODE_SUCCESS,Constants.RESMSG_SUCCESS,resultBean);
    }

    @Override
    public ResultBean callback(HttpServletRequest request) {
        JSONObject resultBean = new JSONObject();
        String filename = request.getParameter("filename");
        filename = "https://".concat(ALIYUN_OSS_ENDPOINT).concat("/").concat(filename);
        resultBean.put("filename", filename);
        resultBean.put("size", request.getParameter("size"));
        resultBean.put("mimeType", request.getParameter("mimeType"));
        resultBean.put("width", request.getParameter("width"));
        resultBean.put("height", request.getParameter("height"));

        ... ...   // 针对每张图片或者视频资源的处理
        
        return new ResultBean(Constants.RESCODE_SUCCESS, Constants.RESMSG_SUCCESS, resultBean);
    }
}

添加OSSController接口

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpServletRequest;

@RestController
@RequestMapping("/aliyun/oss")
public class OssController {

    private static Logger log = LoggerFactory.getLogger(OssController.class);
    @Autowired
    private OssBiz ossService;

    @Transactional(rollbackFor = Exception.class)
    @GetMapping("/policy")
    public ResultBean policy() {
        ResultBean result = ossService.getPolicy();
        log.info("服务端生成签名:{}",result);
        return result;
    }

    @PostMapping("/callback")
    public ResultBean callback(HttpServletRequest request) {
        ResultBean ossCallbackResult = ossService.callback(request);
        log.info("oss成功的回调:{}",ossCallbackResult);
        return ossCallbackResult;
    }
}

OSS文件删除

/**
 * http://
 */
private final String FLAG_HTTP = "http://";
/**
 * https://
 */
private final String FLAG_HTTPS = "https://";
/**
 * 空字符串
 */
private final String FLAG_EMPTY_STRING = "";
/**
 * endpoint
 */
@Value("${aliyun.oss.endpoint1}")
private String endpoint;
/**
 * access key id
 */
@Value("${aliyun.oss.accessKeyId}")
private String accessKeyId;
/**
 * access key secret
 */
@Value("${aliyun.oss.accessKeySecret}")
private String accessKeySecret;
/**
 * bucket name (namespace)
 */
@Value("${aliyun.oss.bucketName}")
private String bucketName;
/**
 * 删除文件
 *
 * @param fileUrl 文件访问的全路径
 */
public void deleteFile(String fileUrl) {
    log.info("Start to delete file from OSS.{}", fileUrl);
    if (StringUtils.isEmpty(fileUrl)
        || (!fileUrl.startsWith(FLAG_HTTP)
            && !fileUrl.startsWith(FLAG_HTTPS))) {
        log.error("Delete file failed because the invalid file address. -> {}", fileUrl);
        return;
    }
    OSSClient ossClient = null;
    try {
        String key = fileUrl.replace(getHostUrl(), FLAG_EMPTY_STRING);
        if (log.isDebugEnabled()) {
            log.debug("Delete file key is {}", key);
        }
        ossClient = new OSSClient(endpoint, accessKeyId, accessKeySecret);
        ossClient.deleteObject(bucketName, key);
    } catch (Exception e) {
        log.error("Delete file error.", e);
    } finally {
        if (ossClient != null) {
            ossClient.shutdown();
        }
    }
}

前端请求

『upload.js』中的代码如下:

accessid = ''
accesskey = ''
host = ''
policyBase64 = ''
signature = ''
callbackbody = ''
filename = ''
key = ''
expire = 0
g_object_name = ''
g_object_name_type = ''
now = timestamp = Date.parse(new Date()) / 1000; 

// 1、用户向应用服务器请求上传Policy和回调。
// 如下代码片段设置应用服务器的URL,客户端会根据此URL发送GET请求来获取需要的信息。
function send_request()
{
    var xmlhttp = null;
    if (window.XMLHttpRequest)
    {
        xmlhttp=new XMLHttpRequest();
    }
    else if (window.ActiveXObject)
    {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  
    if (xmlhttp!=null)
    {
        // serverUrl是 用户获取 '签名和Policy' 等信息的应用服务器的URL,请将下面的IP和Port配置为您自己的真实信息。
        serverUrl = 'http://ip:port/aliyun/oss/policy'
		
        xmlhttp.open( "GET", serverUrl, false );
        xmlhttp.send( null );
        return xmlhttp.responseText
    }
    else
    {
        alert("Your browser does not support XMLHTTP.");
    }
};

// 2、应用服务器返回上传Policy和回调设置代码。
// 应用服务器的签名直传服务会处理客户端发过来的Get请求信息,可以设置对应的返回信息。
function get_signature()
{
    // 可以判断当前expire是否超过了当前时间, 如果超过了当前时间, 就重新取一下,10s 作为缓冲。
    now = timestamp = Date.parse(new Date()) / 1000; 
    if (expire < now + 10)
    {
        body = send_request()
        var obj = eval ("(" + body + ")");
        host = obj.resultContent['host']
        policyBase64 = obj.resultContent['policy']
        accessid = obj.resultContent['accessid']
        signature = obj.resultContent['signature']
        expire = parseInt(obj.resultContent['expire'])
        callbackbody = obj.resultContent['callback'] 
        key = obj.resultContent['dir']
        return true;
    }
    return false;
};

// 生成16位随机字符串, 用于当作随机文件名
function random_string(len) {
  len = len || 32;
  var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';   
  var maxPos = chars.length;
  var pwd = '';
  for (i = 0; i < len; i++) {
      pwd += chars.charAt(Math.floor(Math.random() * maxPos));
    }
    return pwd;
}

// 获取文件后缀, 用于随机文件名的后缀
function get_suffix(filename) {
    pos = filename.lastIndexOf('.')
    suffix = ''
    if (pos != -1) {
        suffix = filename.substring(pos)
    }
    return suffix;
}

// 判断是用上传前的文件名还是随机一个文件名
function calculate_object_name(filename)
{
    if (g_object_name_type == 'local_name')
    {
        g_object_name += "${filename}"
    }
    else if (g_object_name_type == 'random_name')
    {
        suffix = get_suffix(filename)
        g_object_name = key + random_string(10) + suffix
    }
    return ''
}

// 初始化一些参数
function set_upload_param(up, filename, ret)
{
    if (ret == false)
    {
        ret = get_signature()
    }
    g_object_name = key;
    if (filename != '') { 
		suffix = get_suffix(filename)
        calculate_object_name(filename)
    }
    new_multipart_params = {
        'key' : g_object_name,
        'policy': policyBase64,
        'OSSAccessKeyId': accessid, 
        'success_action_status' : '200', //让服务端返回200,不然,默认会返回204
        'callback' : callbackbody,
        'signature': signature,
    };

    up.setOption({
        'url': host,
        'multipart_params': new_multipart_params
    });

    up.start();
}

// 上传
var uploader = new plupload.Uploader({
    runtimes : 'html5,flash,silverlight,html4',
    browse_button : 'selectfiles', 
    multi_selection: false,
    container: document.getElementById('div_p_img'),
    flash_swf_url : 'lib/js/Moxie.swf',
    silverlight_xap_url : 'lib/js/Moxie.xap',
    url : 'http://oss.aliyuncs.com',

    // 利用Plupload的属性filters设置上传的过滤条件,如设置只能上传图片、上传文件的大小、不能有重复上传等
    filters: {
        mime_types : [ //设置上传的类型
            { title : "Image files", extensions : "jpg,gif,png,bmp,mp4,avi" }, 
            { title : "Zip files", extensions : "zip,rar" },
	    { title : "mp4 files", extensions : "mp4" }
        ],
        max_file_size : '100mb', //最大只能上传100mb的文件
        prevent_duplicates : true //不允许选取重复文件
    },

    init: {
	PostInit: function() {
	},

	FilesAdded: function(up, files) {
	    var files = this.files;
	    $.each(uploader.files, function (i, file) {
		if (uploader.files.length > 1) {						 
                    uploader.removeFile(file);
		    return;
		}
	    });
	    $("#div_p_img img").hide();
	    app.p_show=false;
			
	    plupload.each(files, function (file) {
	        $("#div_p_img img").show();
	        app.p_show=true;
	        //显示预览图片
	        // previewImage(file, function(imgSrc) {
	        //     $("#div_p_img img").eq(0).attr("src", imgSrc);
	        // });

	        var objUrl = getObjectURL(file.getNative());
	        $("#div_p_img img").eq(0).attr("src",objUrl);
	    });
        },

	BeforeUpload: function(up, file) {
            set_upload_param(up, file.name, true);
        },

	UploadProgress: function(up, file) {
	    uploader.removeFile(file);
	},

	FileUploaded: function(up, file, info) {
            if (info.status == 200)
            {
                //回调成功
            }
            else if (info.status == 203)
            {
                // 上传到OSS成功,但是oss访问用户设置的上传回调服务器失败
            }
            else
            {
                // 
            } 
	},

	Error: function(up, err) {
            if (err.code == -600) {
                // 选择的文件太大了,可以根据应用情况,设置一下上传的最大大小
            }
            else if (err.code == -601) {
                // n选择的文件后缀不对,可以根据应用情况,设置可允许的上传文件类型
            }
            else if (err.code == -602) {
                // 这个文件已经上传过一次,如需再次上传,可改名字
            }
            else 
            {
                // nError
            }
	}
    }
});

uploader.init();

可以批量上传图片/视频等资源,每上传一次就会回调一次。OSS没有开放批量上传接口,批量上传需要使用一个循环去上传所有文件,示例与单个上传一致。