放肆青春的博客
首页
前端
算法
网络
面试
技术
后端
运维
杂项
数据库
工具
网址
电脑
个人
文章
  • 分类
  • 标签
  • 归档
github (opens new window)
gitee (opens new window)

放肆青春

一个前端菜鸟的技术成长之路
首页
前端
算法
网络
面试
技术
后端
运维
杂项
数据库
工具
网址
电脑
个人
文章
  • 分类
  • 标签
  • 归档
github (opens new window)
gitee (opens new window)
  • 技术汇总

    • 技术总结
    • 技术文章
  • 技术术语

  • 技术方案

    • 技术场景汇总
    • 技术方案

    • 前端方案

    • 三方平台

      • 阿里相关业务
        • 阿里相关业务
          • 阿里 OSS 图片处理
          • 阿里 OSS 服务端签名后直传
          • 视频点播
    • 图片方案

    • 文件方案

  • 技术点

  • 设计模式及原则

    • 设计模式
    • 创建型模式

    • 结构型模式

    • 行为型模式

    • 设计原则
  • technology
放肆青春
2021-11-03

阿里相关业务

# 阿里相关业务

# 阿里 OSS 图片处理

图片处理文档:https://help.aliyun.com/document_detail/101260.html (opens new window)

图片缩放文档:https://help.aliyun.com/document_detail/44688.html#title-ov0-a3i-pq9 (opens new window)

图片缩放 demo:获取180*180缩略图 https://oss.com/p/30/972530_main_1.jpg?x-oss-process=image/resize,m_fill,h_180,w_180

# 阿里 OSS 服务端签名后直传

服务端签名后直传的原理如下:

  1. 用户发送上传 Policy 请求到应用服务器。
  2. 应用服务器返回上传 Policy 和签名给用户。
  3. 用户直接上传数据到 OSS。

注意:该方案不会上传过程不会通知应用服务器,如果需要通知应用服务器,需要配置回调函数:传送门 (opens new window)

上传 oss 核心代码:

// 从服务器获取oss配置信息
let res = await getPolicy();
if (res.code != 200) return;
let ret = res.data;

// 构造form表单
var form = new FormData();
form.append("signature", `${ret.signature}`);
form.append("OSSAccessKeyId", `${ret.accessid}`);
form.append("success_action_status", "200");
form.append("policy", `${ret.policy}`);
form.append("key", `${ret.dir}${v.name}`);
form.append("file", v);

axios.post(ret.host, form, { withCredentials: false }); // 不能携带浏览器信息
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# 视频点播

使用 JavaScript 上传 SDK https://www.alibabacloud.com/help/zh/doc-detail/52204.html (opens new window)

更新时间: 2/15/2022, 7:14:11 PM
组件库
图片

← 组件库 图片→

最近更新
01
前端权限管理
02-24
02
vue2指令
02-24
03
vue2 hook
02-24
更多文章>
Theme by Vdoing | Copyright © 2019-2022 放肆青春
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式