1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > 阿里云对象存储(oss)之服务端签名后直传

阿里云对象存储(oss)之服务端签名后直传

时间:2023-08-05 14:40:58

相关推荐

阿里云对象存储(oss)之服务端签名后直传

本文主要介绍如何基于Post Policy的使用规则在服务端通过各种语言代码完成签名,然后通过表单直传数据到OSS。由于服务端签名直传无需将AccessKey暴露在前端页面,相比JavaScript客户端签名直传具有更高的安全性。

原理流程如图所示:

开通阿里云oss步骤:

第一步注册登录阿里云

第二步搜索对象存储oss并开通进入OSS管理控制台

第三步创建bucket仓库(需要阿里云官方验证要一定时间 具体创建细节自行百度即可)

第四步修改CORS(否则上传图片会有跨域问题)

第五步开通自己的AccessKey 会有accesskey id 和 accesskey secret 给你,至于往后在此拿accesskey secret则需要短信验证了

后端步骤

第一步引入 依赖

<!--对象存储--><dependency><groupId>com.alibaba.cloud</groupId><artifactId>spring-cloud-starter-alicloud-oss</artifactId></dependency><!--com.alibaba.cloud依赖管理--><dependencyManagement><dependencies><dependency><groupId>com.alibaba.cloud</groupId><artifactId>spring-cloud-alibaba-dependencies</artifactId><version>2.1.0.RELEASE</version><type>pom</type><scope>import</scope></dependency></dependencies></dependencyManagement>

第二步配置核心配置文件

application.yml

application.properties (开启服务配置功能 可配可不配)

java代码:

package com.gulimall.gulimallthirdparty.controller;import com.alibaba.fastjson.JSONObject;import com.aliyun.oss.OSS;import com.aliyun.oss.OSSClient;import com.mon.utils.BinaryUtil;import com.aliyun.oss.model.MatchMode;import com.aliyun.oss.model.PolicyConditions;import mon.utils.R;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.beans.factory.annotation.Value;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;import java.io.UnsupportedEncodingException;import java.security.KeyStore;import java.text.SimpleDateFormat;import java.util.Date;import java.util.LinkedHashMap;import java.util.Map;import java.util.logging.SimpleFormatter;@SuppressWarnings("all")@RestControllerpublic class OssController {@AutowiredOSS ossClient;@Value("${spring.cloud.alicloud.oss.endpoint}")private String endoint;@Value("${spring.cloud.alicloud.oss.bucket}")private String bucket;@Value("${spring.cloud.alicloud.access-key}")private String accessId;@RequestMapping("oss/policy")public R Policy() {// 填写Host地址,格式为https://bucketname.endpoint。String host = "https://" + bucket + "." + endoint;// 设置上传到OSS文件的前缀,可置空此项。置空后,文件将上传至Bucket的根目录下。String format = new SimpleDateFormat("yyyy:MM:hh").format(new Date());String dir = format + "/";Map<String, String> respMap = null;try {long expireTime = 6000;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 = ossClient.generatePostPolicy(expiration, policyConds);byte[] binaryData = postPolicy.getBytes("utf-8");String encodedPolicy = BinaryUtil.toBase64String(binaryData);String postSignature = ossClient.calculatePostSignature(postPolicy);respMap = new LinkedHashMap<String, String>();respMap.put("accessid", accessId);respMap.put("policy", encodedPolicy);respMap.put("signature", postSignature);respMap.put("dir", dir);respMap.put("host", host);respMap.put("expire", String.valueOf(expireEndTime / 1000));} catch (Exception e) {System.out.println(e.getMessage());}return R.ok().put("data", respMap);}}

以上是阿里云oss提供给的操作代码 自行修改就行了

前端步骤

链接:/s/15hQ2deh81-6ZAnAsUXt5Zg

提取码:zxn4

三个文件放入到你的前端项目中 至于怎么组装到你的项目中去就看你是什么项目了 比如我这个是vue项目 我放入到src-->components下 然后再views里面去引入这个组件

下面就是你的后端请求路径先去后端通过base64加密的形式拿到你后端的密钥回调给客户端,客户端再拿着这个密钥和图片直接给oss 注意先拿密钥再推送图片过去,在action这里写入你的host(bucket+endpoint) 不然客户端拿到签名和图片不知道给谁了

import http from '@/utils/httpRequest.js'export function policy() {return new Promise((resolve,reject)=>{http({url: http.adornUrl("/thirdparty/oss/policy"),method: "get",params: http.adornParams({})}).then(({ data }) => {resolve(data);})});}

有两个请求是因为 这里是跨域了 我做了跨域配置 会先有一个一模一样预检请求(options类型的请求),检查到没有跨域问题时,我的图片上传请求才开始(post类型的请求)

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。