图片存储解决方案-阿里云对象存储

开通对象存储OSS

1. 打开阿里云官网,选择产品对象存储 OSS

图片存储解决方案-阿里云对象存储

2.开通对象存储OSS

图片存储解决方案-阿里云对象存储

需要支付宝扫码登录

3.进入管理控制台

图片存储解决方案-阿里云对象存储

4.新建存储空间

图片存储解决方案-阿里云对象存储

图片存储解决方案-阿里云对象存储

5.跨域资源共享(CORS)的设置

图片存储解决方案-阿里云对象存储

图片存储解决方案-阿里云对象存储

图片存储解决方案-阿里云对象存储

图片存储解决方案-阿里云对象存储

管理文件

图片存储解决方案-阿里云对象存储

整合Springboot实现图片上传

服务端签名直传并设置上传回调 : 在服务端完成签名,并且设置上传回调,然后通过表单直传数据到OSS

更多详细文档参照:

https://help.aliyun.com/document_detail/31927.html?spm=a2c4g.11186623.6.1525.70f77eaeNZGCTb

一、流程介绍

图片存储解决方案-阿里云对象存储

流程如下:

1. 用户向应用服务器请求上传的Policy和回调。

2. 应用服务器返回上传Policy和回调设置。

3. 用户直接向OSS发送文件上传请求。

4. OSS根据用户的回调设置,发送回调请求给应用服务器。

5. 应用服务器返回响应给OSS。

6.OSS将应用服务器返回的内容返回给用户

二、体验测试

服务器端源码 : aliyun-oss-appserver-java-master

客户端源码: aliyun-oss-appserver-js-master

在服务器端找到并打开源码文件CallbackServer.java,修改如下的代码片段:

<code>

String

accessId =

""

;

String

accessKey =

""

;

String

endpoint =

"oss-cn-hangzhou.aliyuncs.com"

;

String

bucket =

"bucket-name"

;

String

host =

"https://"

+ bucket +

"."

+ endpoint;

String

callbackUrl =

"http://88.88.88.88:8888"

;

String

dir =

"user-dir-prefix/"

; /<code>

在客户端打开upload.js文件,找到下面的代码语句:

<code> 
serverUrl = 

'http

:/<code>

将severUrl改成应用服务器的地址,客户端可以通过它获取签名直传Policy等信息

三、流程解析

3.1 用户向应用服务器请求上传Policy和回调。

在客户端源码中的upload.js文件中,如下代码片段的变量serverUrl的值可以用来设置应用服务器的URL。设置好之后,客户端会向该serverUrl发送GET请求来获取需要的信息。

3.2 应用服务器返回上传Policy和回调设置代码。

应用服务器侧的签名直传服务会处理客户端发过来的GET请求消息,您可以设置对应的代码让应用服务器能够给客户端返回正确的消息。

<code>{

"accessid"

:

"6MKO******4AUk44"

,

"host"

:

"http://post-test.oss-cn-hangzhou.aliyuncs.com"

,

"policy"

:

"eyJleHBpcmF0aW9uIjoiMjAxNS0xMS0wNVQyMDo1Mjoy******Jjdb25kaXRpb25zIjpbWyJjdb250ZW50LWxlbmd0aC1yYW5nZSIsMCwxMDQ4NTc2MDAwXSxbInN0YXJ0cy13aXRoIiwiJGtleSIsInVzZXItZGlyXC8iXV19"

,

"signature"

:

"VsxOcOudx******z93CLaXPz+4s="

,

"expire"

:

1446727949

,

"callback"

:

"eyJjYWxsYmFja1VybCI6Imh0dHA6Ly9vc3MtZGVtby5hbGl5dW5jcy5jdb206MjM0NTAiLCJjYWxsYmFja0hvc3QiOiJvc3MtZGVtby5hbGl5dW5jcy5jdb20iLCJjYWxsYmFja0JvZHkiOiJmaWxlbmFtZT0ke29iamVjdH0mc2l6ZT0ke3NpemV9Jm1pbWVUeXBlPSR7bWltZVR5cGV9JmhlaWdodD0ke2ltYWdlSW5mby5oZWlnaHR9JndpZHRoPSR7aW1hZ2VJdbmZvLndpZHRofSIsImNhbGxiYWNrQm9keVR5cGUiOiJhcHBsaWNhdGlvbi94LXd3dy1mb3JtLXVybGVuY29kZWQifQ=="

,

"dir"

:

"user-dirs/"

}/<code>

上述示例的callback内容采用的是base64编码。经过base64解码后的内容如下:

<code>{

"callbackUrl"

:

"http://oss-demo.aliyuncs.com:23450"

,

"callbackHost"

:

"oss-demo.aliyuncs.com"

,

"callbackBody"

:

"filename=

${object}

&size=

${size}

&mimeType=

${mimeType}

&height=

${imageInfo.height}

&width=

${imageInfo.width}

"

,

"callbackBodyType"

:

"application/x-www-form-urlencoded"

}/<code>

3.3 用户直接向OSS发送文件上传请求

3.4 OSS根据用户的回调设置,发送回调请求给应用服务器

客户端上传文件到OSS结束后,OSS解析客户端的上传回调设置,发送POST回调请求给应用服务器。

3.5 应用服务器返回响应给OSS。

应用服务器根据OSS发送消息中的authorization来进行验证,如果验证通过,则向OSS返回如下json格式的成功消息。

String value: OK

Key: Status

3.6 OSS将应用服务器返回的消息返回给用户。

四、代码实现上传步骤

1. 在pom.xml中添加相关依赖

<code> 

<

dependency

>

<

groupId

>

com.aliyun.oss

groupId

>

<

artifactId

>

aliyun-sdk-oss

artifactId

>

<

version

>

2.5.0

version

>

dependency

>

/<code>

2.修改application.yml文件,添加OSS相关配置

<code> 

aliyun:

oss:

endpoint:

oss-cn-beijing.aliyuncs.com

accessKeyId:

该值需要保密,修改成自己的即可

accessKeySecret:

该值需要保密,修改成自己的即可

bucketName:

macro-oss10001

policy:

expire:

300

maxSize:

10

callback:

http://cv4bwb.natappfree.cc/aliyun/oss/callback

dir:

prefix:

mall/images/

/<code>

3.OSS的相关Java配置类 - OSS的连接客户端OSSClient

<code> 

public

class

OssConfig

{

private

String ALIYUN_OSS_ACCESSKEYID;

private

String ALIYUN_OSS_ACCESSKEYSECRET;

private

String ALIYUN_OSS_ENDPOINT;

public

OSSClient ossClient(){

return

new OSSClient(ALIYUN_OSS_ENDPOINT, ALIYUN_OSS_ACCESSKEYID, ALIYUN_OSS_ACCESSKEYSECRET); } }/<code>

4.添加OSS上传策略封装对象OssPolicyResult

<code>

public

class

OssPolicyResult {

private

String

accessKeyId;

private

String

policy;

private

String

signature;

private

String

dir;

private

String

host;

private

String

callback;/<code>

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

<code>

public

class

OssCallbackParam {

private

String

callbackUrl;

private

String

callbackBody;

private

String

callbackBodyType;/<code>

6.OSS上传成功后的回调结果对象OssCallbackResult

<code>

public

class

OssCallbackResult {

private

String

filename;

private

String

mimeType;

private

String

size;

private

String

height;

private

String

width;/<code>

7.添加OSS业务接口OssService

<code>

public

interface

OssService

{

OssPolicyResult

policy

(

)

;

OssCallbackResult

callBack

(

HttpServletRequest request

)

; }/<code>

8.添加OSS业务接口OssService的实现类OssServiceImpl

<code> 

public

class

OssServiceImpl

implements

OssService{ (

"${aliyun.oss.policy.expire}"

)

private

long ALIYUN_OSS_EXPIRE; (

"${aliyun.oss.maxSize}"

)

private

Integer ALIYUN_OSS_MAXSIZE; (

"${aliyun.oss.dir.prefix}"

)

private

String

ALIYUN_OSS_DIR_PREFIX; (

"${aliyun.oss.accessKeyId}"

)

private

String

ALIYUN_OSS_ACCESSKEYID; (

"${aliyun.oss.endpoint}"

)

private

String

ALIYUN_OSS_ENDPOINT; (

"${aliyun.oss.bucketName}"

)

private

String

ALIYUN_OSS_BUCKETNAME; (

"${aliyun.oss.callback}"

)

private

String

ALIYUN_OSS_CALLBACK;

private

OSSClient ossClient;

public

OssPolicyResult policy() { OssPolicyResult result =

new

OssPolicyResult(); long expireEndTime = System.currentTimeMillis()+ALIYUN_OSS_EXPIRE*

1000

;

Date

expireDate =

new

Date

(expireEndTime); SimpleDateFormat sf =

new

SimpleDateFormat(

"yyyyMMdd"

);

String

format = sf.format(

new

Date

());

String

dir = ALIYUN_OSS_DIR_PREFIX+format+

"/"

;

try

{ PolicyConditions policyConditions =

new

PolicyConditions(); policyConditions.addConditionItem(PolicyConditions.COND_CONTENT_LENGTH_RANGE,

0

,ALIYUN_OSS_MAXSIZE*

1024

*

1024

); policyConditions.addConditionItem(MatchMode.StartWith,PolicyConditions.COND_KEY,dir);

String

postPolicy = ossClient.generatePostPolicy(expireDate, policyConditions); System.out.println(

"=========>postPolicy:"

+postPolicy); byte[] binaryData = postPolicy.getBytes(

"utf-8"

);

String

encodedPolicy = BinaryUtil.toBase64String(binaryData);

String

postSignature = ossClient.calculatePostSignature(postPolicy); OssCallbackParam ossCallbackParam =

new

OssCallbackParam(); ossCallbackParam.setCallbackUrl(ALIYUN_OSS_CALLBACK); ossCallbackParam.setCallbackBody(

"filename=${object}&size=${size}&mimeType=${mimeType}&height=${imageInfo.height}&width=${imageInfo.width}"

); ossCallbackParam.setCallbackBodyType(

"application/x-www-form-urlencoded"

);

String

callback = BinaryUtil.toBase64String(

JSON

.toJSONString(ossCallbackParam).getBytes(

"utf-8"

)) ; result.setAccessKeyId(ALIYUN_OSS_ACCESSKEYID); result.setPolicy(encodedPolicy); result.setDir(dir); result.setHost(

"http://"

+ALIYUN_OSS_BUCKETNAME+

"."

+ALIYUN_OSS_ENDPOINT); result.setSignature(postSignature); result.setCallback(callback); System.out.println(

JSON

.toJSONString(result)); }

catch

(UnsupportedEncodingException e) { e.printStackTrace(); }

return

result; }

public

OssCallbackResult callBack(HttpServletRequest request) { OssCallbackResult result =

new

OssCallbackResult();

String

filename = request.getParameter(

"filename"

); filename =

"http://"

.concat(ALIYUN_OSS_BUCKETNAME).concat(

"."

).concat(ALIYUN_OSS_ENDPOINT) .concat(

"/"

).concat(filename); result.setFilename(filename); result.setHeight(request.getParameter(

"height"

)); result.setWidth(request.getParameter(

"width"

)); result.setMimeType(request.getParameter(

"mimeType"

)); result.setSize(request.getParameter(

"size"

));

return

result; } }/<code>

9. 添加OssController定义接口

<code> 
 

public

class

OssController

{

private

OssServiceImpl ossService;

public

OssPolicyResult policy() { OssPolicyResult result = ossService.policy();

return

result; }

public

OssCallbackResult callback(HttpServletRequest request) { OssCallbackResult ossCallbackResult = ossService.callBack(request);

return

ossCallbackResult; } }/<code>

10.访问项目测试即可


分享到:


相關文章: