使用服务端的临时密钥，不依赖阿里js的putFIle--》阿里oss
<!DOCTYPE html>
<html lang='en'> <head>
<meta charset='UTF-8'>
<title>Title</title>
</head> <body>
<input type='file' id='fileInput' onchange='uploadFile()'> 请点击上传文件
</body> </html>
<script type="text/javascript" src="./crypto-js/crypto-js.js"></script> <script>
const sleep = function (ms) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve()
}, ms)
})
}
const waitServerDeal = async function (ms) {
console.log('start-Req')
// 请求服务器获取tts相关字段
// 可通过CROS对前后端进行配置，解决跨域问题
const ourSTSurl = 'http://genSecurityTokenServiceByGoEcho.com:1324/aliSTS/33333'
const xhr = new XMLHttpRequest()
const verb = 'GET'
xhr.open(verb, ourSTSurl)
xhr.setRequestHeader('Access-Control-Allow-Origin', '*')
xhr.send()
// 等待响应耗时
await sleep(ms)
console.log('end-start-parsResp')
const resp = JSON.parse(xhr.response)
console.log(resp)
// 讨论接口返回值
if ('AccessKeyId' in resp) {
const AccessKeyId = resp.AccessKeyId
const AccessKeySecret = resp.AccessKeySecret
const Expiration = resp.Expiration
const SecurityToken = resp.SecurityToken // 上传
const file = fileInput.files[0]
const aliHost = 'bizBucket.oss-cn-hangzhou.aliyuncs.com'
const VERB = 'PUT'
const dGMT = new Date().toUTCString()
const ContentType = file.type
const ContentMD5 = ''
const CanonicalizedOSSHeaders = 'x-oss-content-length:' + file.size + '\nx-oss-date:' + dGMT +
'\nx-oss-host:' + aliHost + '\nx-oss-security-token:' + SecurityToken
const ossBucketName = 'bizBucket' if (file.name.endsWith(".mp4")) {
ossBizConfigRes = '/uploads/video/26/'
} else {
ossBizConfigRes = '/uploads/imgs/26/'
}
const ossKey = ossBizConfigRes + file.name
const CanonicalizedResource = '/' + ossBucketName + ossKey
console.log(CanonicalizedResource)
const message = VERB + '\n' + ContentMD5 + '\n' + ContentType + '\n' + dGMT + '\n' +
CanonicalizedOSSHeaders + '\n' + CanonicalizedResource
console.log(message) // 简单的REST接口，在任何时间、任何地点、任何互联网设备上进行上传和下载数据 // 公共HTTP头定义_API 参考_对象存储 OSS-阿里云 https://help.aliyun.com/document_detail/31955.html
// PutObject_关于Object操作_API 参考_对象存储 OSS-阿里云 https://help.aliyun.com/document_detail/31978.html
// 在Header中包含签名_访问控制_API 参考_对象存储 OSS-阿里云 https://help.aliyun.com/document_detail/31951.html // 加密方法
// crypto-js - npm https://www.npmjs.com/package/crypto-js const hash = CryptoJS.HmacSHA1(message, AccessKeySecret);
const base64 = CryptoJS.enc.Base64.stringify(hash);
// CryptoJS.enc.Base64.stringify(hash) === hash.toString(CryptoJS.enc.Base64)
const Authorization = 'OSS ' + AccessKeyId + ':' + base64
console.log(Authorization)
const myReq = new XMLHttpRequest()
// 结合file.type、上传者身份、存储逻辑设置oss文件key
const reqUrl = 'https://' + aliHost + ossKey
myReq.open('PUT', reqUrl)
myReq.setRequestHeader('Authorization', Authorization)
myReq.setRequestHeader('x-oss-host', aliHost)
myReq.setRequestHeader('x-oss-content-length', file.size)
myReq.setRequestHeader('Content-Type', file.type)
myReq.setRequestHeader('x-oss-date', dGMT)
myReq.setRequestHeader('x-oss-security-token', SecurityToken)
myReq.send(file)
console.log(myReq)
// calllback
}
} // 监听文件提交
const uploadFile = () => {
console.log(33)
const fileInput = document.getElementById('fileInput')
// 判断待文件是否存在
if (fileInput.files.length > 0) {
waitServerDeal(5000)
}
}
</script>
package main import (
"./myKey"
"fmt"
"os" "github.com/aliyun/aliyun-sts-go-sdk/sts"
"github.com/labstack/echo"
"github.com/labstack/echo/middleware"
"net/http"
) func handleError(err error) {
fmt.Println(err)
os.Exit(-1)
} const (
accessKeyID = myKey.AccessKeyID
accessKeySecret = myKey.AccessKeySecret
roleArn = myKey.RoleArn
sessionName = myKey.SessionName
) type ExceptionResp struct {
Status string
Message string
} func main() {
e := echo.New()
e.Use(middleware.CORSWithConfig(middleware.CORSConfig{
// AllowOrigins: []string{"https://labstack.com", "https://labstack.net"},
AllowOrigins: []string{"*"},
// AllowHeaders: []string{echo.HeaderOrigin, echo.HeaderContentType, echo.HeaderAccept},
AllowHeaders: []string{"*"},
}))
e.GET("/aliSTS/:uid", func(c echo.Context) error {
uid := c.Param("uid")
fmt.Println("LOG ", uid)
stsClient := sts.NewClient(accessKeyID, accessKeySecret, roleArn, sessionName)
resp, err := stsClient.AssumeRole(3600)
if err != nil {
handleError(err)
r := &ExceptionResp{
Status: "-1",
Message: "what?",
}
return c.JSON(http.StatusOK, r)
}
r := resp.Credentials
return c.JSON(http.StatusOK, r)
})
e.Logger.Fatal(e.Start(":1324"))
}
使用服务端的临时密钥，不依赖阿里js的putFIle--》阿里oss的更多相关文章
- 无服务端纯前台导出数据到Excel-JSExcelXML.js 使用指南
JSExcelXML 使用指南 先来个效果预览 a.前端显示 b.导出excel效果 表头部分 表尾部分 1.功能描述 JsExcelXml 采用js生成excel中可显示的xml格式文本,将输出文本 ...
- 使用 PHP 来做 Vue.js 的 SSR 服务端渲染
对于客户端应用来说,服务端渲染是一个热门话题.然而不幸的是,这并不是一件容易的事,尤其是对于不用 Node.js 环境开发的人来说. 我发布了两个库让 PHP 从服务端渲染成为可能.spatie/se ...
- vertx 从Tcp服务端和客户端开始翻译
写TCP 服务器和客户端 vert.x能够使你很容易写出非阻塞的TCP客户端和服务器 创建一个TCP服务 最简单的创建TCP服务的方法是使用默认的配置:如下 NetServer server = ve ...
- 实现ssr服务端渲染
前言 前段时间寻思做个个人网站,然后就立马行动了. 个人网站如何实现选择什么技术方案,自己可以自由决定. 刚好之前有大致想过服务端渲染,加载速度快,还有 SEO 挺适合个人网站的. 所以就自己造 ...
- 教你如何在React及Redux项目中进行服务端渲染
服务端渲染(SSR: Server Side Rendering)在React项目中有着广泛的应用场景 基于React虚拟DOM的特性,在浏览器端和服务端我们可以实现同构(可以使用同一份代码来实现多端 ...
- c# .NET RSA结合AES加密服务端和客户端请求数据
这几天空闲时间就想研究一下加密,环境是web程序,通过js请求后台返回数据,我想做的事js在发送请求前将数据加密,服务端收到后解密,待服务端处理完请求后,将处理结果加密返回给客户端,客户端在解密,于是 ...
- next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器，并用PM2守护程序
前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...
- java服务端集成极光消息推送--详细开发步骤
1.极光推送账号准备 要使用极光消息推送必须先在官方网站上注册账号,并添加应用. 产品介绍:https://docs.jiguang.cn/jpush/guideline/intro/ 注册开发者账号 ...
- GridView 服务端控件添加 js
针对服务端控件的 CommandField “Delete” 添加 js $("#GridView1").find("a").each( function() ...
随机推荐
- 维生素C - 坏血症
在地理大发现时代,许多水手在远洋航行时不幸罹患一种典型航海病,患者皮肤溃烂.牙龈出血不止,不久就会危及生命,这就是大名鼎鼎的坏血症,是一种因为缺乏维生素C而产生的的皮.粘膜下出血.齿龈肿胀.关节和肌肉 ...
- Xamarin XAML语言教程Xamarin.Forms中程序状态与进度（一）
Xamarin XAML语言教程Xamarin.Forms中程序状态与进度(一) 在Xamarin.Forms中,提供了两个控件用来指示程序的状态和进度.他们分别为活动指示器和进度条.其中,活动指示器 ...
- POJ 3480 John [博弈之Nim 与 Anti-Nim]
Nim游戏:有n堆石子,每堆个数不一,两人依次捡石子,每次只能从一堆中至少捡一个.捡走最后一个石子胜. 先手胜负:将所有堆的石子数进行异或(xor),最后值为0则先手输,否则先手胜. ======== ...
- java文件下载导出
前台代码: $("#btnExport").click(function(){ top.$.jBox.confirm("确认要导出房屋信息吗?","系 ...
- 转：Java并发编程：volatile关键字解析
Java并发编程:volatile关键字解析 Java并发编程:volatile关键字解析 volatile这个关键字可能很多朋友都听说过,或许也都用过.在Java 5之前,它是一个备受争议的关键字, ...
- centos 7 关闭firewalld开启iptables
1: 关闭系统高级防火墙firewalld systemctl stop firewalld.service #停止firewall systemctl disable firewalld.servi ...
- 一款不错的编程字体Source Code Pro
我以前一直是用的MS自家的是Consolas的字体,这个字体基本上具有编程字体所需的所有要素:等宽.支持ClearType.中文字体大小合适,l和1,o和0很容易区分.非要挑刺的话就是字体比较小,9号 ...
- 如何在SQLite中创建自增字段
SQLite 简单的回答:一个声明为 INTEGER PRIMARY KEY 的字段将自动增加. 这里是详细的答案: 从 SQLite 的 2.3.4 版本开始,如果你将一个表中的一个字段声明为 ...
- 解决Ubuntu下gedit中文乱码的情况
windows下简体中文多用GBK编码 (或GB2312, GB18030), 而linux下多用UTF-8编码. 因此,一般来说在微软平台编辑的中文txt不能在ubuntu下直接打开查看,除非在保存 ...
- MFC中 用Static控件做超链接（可以实现变手形、下划线、字体变色等功能）
1.新建一个基于对话框的工程MyLink,在对话框中拖一个Static控件,ID可改为IDC_SLink. 2.在头文件中添加成员变量: private: CRect m_Rect; CFont* m ...