vue页面使用阿里oss上传功能的实例(二)


Posted in Javascript onAugust 09, 2017

本文主要介绍OSS管理控制台设置访问权限、角色等。分享给大家,具体如下:

进入控制台,鼠标移到右上角用户名处,点击“访问控制”,如下图:

vue页面使用阿里oss上传功能的实例(二)

如果没有此功能,则将鼠标移至 产品 -> 管理与控制,点击 访问控制进入访问控制产品页

vue页面使用阿里oss上传功能的实例(二)

1.创建子账号

点击左侧的 用户管理 -> 自定义授权策略 ->新建授权策略 , 如下图:

vue页面使用阿里oss上传功能的实例(二)

2.新建授权策略

点击左侧的 策略管理 -> 新建用户 , 如下图:

vue页面使用阿里oss上传功能的实例(二)

  • 在弹出对话框中:选择授权策略模板(使用空模板)
  • 编辑授权策略并提交:修改 授权策略名称(自定义名称),备注,策略内容,并提交。

示例:一个MNS授权策略内容模版:

{
            "Statement": [
             {
                "Action": "mns:*",
                "Effect": "Allow",
                "Resource": "acs:mns:*:*:*" 
              }
            ],
            "Version": "1"
           }

授权策略是json格式的字符串,其中,Action : 表示要授权的操作,MNS 操作都以"mns:"开头,

例如: "mns:SendMessage" 表示 MNS 服务的API:SendMessage/BatchSenMessage

其他详见附录:MNS API和授权操作映射表;

Effect : 表示授权类型, 例如:Allow, Deny

Resrouce : 表示要授权的阿里云资源名(ARN),格式为:"acs:<云服务名>: <地域名>: <主账号UID>:<资源URI>"

例如:“acs:mns:cn-hangzhou:123456789:/queues/MyQueue1/messages”

表示:授权资源是主账号UID为123456789在cn-hangzhou地域的MyQueue1。
用""表示不指定具体的字段,例如:"acs:mns:::" 表示不指定地域名,主账号ID和资源URI,子账号可以访问主账号的所有mns资源。

3.授权子账号访问MNS

  • 返回 用户管理 ,找到第一步创建的子账号,点击右侧 授权
  • 在弹出的对话框中,选择授权策略名称,并添加到右侧已选授权策略列表,点击 确定 提交,如下图:

vue页面使用阿里oss上传功能的实例(二)

4.创建角色

点击左侧的 角色管理 -> 新建角色如下图:

vue页面使用阿里oss上传功能的实例(二)

vue页面使用阿里oss上传功能的实例(二)

4.授权策略访问角色

点击左侧的 角色管理 ,在右侧的角色列表中选择需要授权的角色,点击授权,如下图:

vue页面使用阿里oss上传功能的实例(二)

5.注意事项

1.server端的代码中

var sts = new STS({
  accessKeyId: '子账号 accessKeyId',
  accessKeySecret: '子账号 accessKeySecret',
});

accessKeyId 和 accessKeySecret 为第一步创建的子用户的 key

2.rolearn

var rolearn = '对应角色的Arn值';

3.policy

var policy = {
  "Version": "1",
  "Statement": [
  {
    "Effect": "Allow",
    "Action": [
    "oss:GetObject",
    "oss:PutObject"
    ],
    "Resource": [
    "acs:oss:*:*:BucketName",
    "acs:oss:*:*:BucketName/*"
    ]
  }
  ]
};

这里的policy 必须和之前创建的策略一致。

源码地址:https://github.com/taosin/alioss-js-upload

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
imgAreaSelect 中文文档帮助说明
Oct 08 Javascript
JavaScript中变量提升 Hoisting
Jul 03 Javascript
javascript将数组插入到另一个数组中的代码
Jan 10 Javascript
JS代码同步文本框内容的实例方法
Jul 12 Javascript
Knockout自定义绑定创建方法
Dec 26 Javascript
javascript 继承学习心得总结
Mar 17 Javascript
JavaScript的模块化开发框架Sea.js上手指南
May 12 Javascript
Angular学习笔记之angular的$filter服务浅析
Nov 12 Javascript
浅谈开发eslint规则
Oct 01 Javascript
小程序如何获取多个formId实现详解
Sep 20 Javascript
详解实现vue的数据响应式原理
Jan 20 Vue.js
JavaScript实现贪吃蛇游戏
Jun 16 Javascript
vue.js框架实现表单排序和分页效果
Aug 09 #Javascript
vue页面使用阿里oss上传功能的实例(一)
Aug 09 #Javascript
快速掌握jquery分页插件jqPaginator的使用方法
Aug 09 #jQuery
vue 打包后的文件部署到express服务器上的方法
Aug 09 #Javascript
vuejs事件中心管理组件间的通信详解
Aug 09 #Javascript
JS实现的加减乘除四则运算计算器示例
Aug 09 #Javascript
AngularJS ionic手势事件的使用总结
Aug 09 #Javascript
You might like
PHP clearstatcache()函数详解
2010/03/02 PHP
windows下zendframework项目环境搭建(通过命令行配置)
2012/12/06 PHP
利用PHP函数计算中英文字符串长度的方法
2014/11/11 PHP
php实现过滤字符串中的中文和数字实例
2015/07/29 PHP
yii使用bootstrap分页样式的实例
2017/01/17 PHP
显示js对象所有属性和方法的函数
2009/10/16 Javascript
javascript 数据类型转换(parseInt,parseFloat)
2010/07/20 Javascript
jquery 圆形旋转图片滚动切换效果
2011/01/19 Javascript
jQuery 中使用JSON的实现代码
2011/12/01 Javascript
button没写type=button会导致点击时提交
2014/03/06 Javascript
jQuery.position()方法获取不到值的安全替换方法
2015/03/13 Javascript
Javascript中获取浏览器类型和操作系统版本等客户端信息常用代码
2016/06/28 Javascript
jquery实时获取时间的简单实例
2017/01/26 Javascript
微信小程序页面滑动屏幕加载数据效果
2020/11/16 Javascript
vue.js todolist实现代码
2017/10/29 Javascript
Vue官方推荐AJAX组件axios.js使用方法详解与API
2018/10/09 Javascript
微信小程序后台持续定位功能使用详解
2019/08/23 Javascript
package.json配置文件构成详解
2019/08/27 Javascript
详解Webpack4多页应用打包方案
2020/07/16 Javascript
微信小程序实现单个或多个倒计时功能
2020/11/01 Javascript
python中查看变量内存地址的方法
2015/05/05 Python
Python字符串处理之count()方法的使用
2015/05/18 Python
Python编程使用NLTK进行自然语言处理详解
2017/11/16 Python
Jupyter notebook在mac:linux上的配置和远程访问的方法
2019/01/14 Python
python如何编写win程序
2020/06/08 Python
python利用pytesseract 实现本地识别图片文字
2020/12/14 Python
HTML5 canvas基本绘图之绘制矩形
2016/06/27 HTML / CSS
strstr()的简单实现
2013/09/26 面试题
杭州龙健科技笔试题.net部分笔试题
2016/01/24 面试题
《鞋匠的儿子》教学反思
2014/03/02 职场文书
成品库仓管员岗位职责
2014/04/06 职场文书
银行优秀员工事迹材料
2014/05/29 职场文书
小组名称和口号
2014/06/09 职场文书
村党组织公开承诺书
2015/04/30 职场文书
Python基于Opencv识别两张相似图片
2021/04/25 Python
详解nginx安装过程并代理下载服务器文件
2022/02/12 Servers