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 相关文章推荐
刷新页面实现方式总结(HTML,ASP,JS)
Nov 13 Javascript
JavaScript 事件属性绑定带参数的函数
Mar 13 Javascript
passwordStrength 基于jquery的密码强度检测代码使用介绍
Oct 08 Javascript
一个非常全面的javascript URL解析函数和分段URL解析方法
Apr 12 Javascript
javascript 动态修改css样式方法汇总(四种方法)
Aug 27 Javascript
js实现可旋转的立方体模型
Oct 16 Javascript
vue使用Element组件时v-for循环里的表单项验证方法
Jun 28 Javascript
Bootstrap Table中的多选框删除功能
Jul 15 Javascript
vue组件实践之可搜索下拉框功能
Nov 25 Javascript
JavaScript语句错误throw、try及catch实例解析
Aug 18 Javascript
vue 中使用print.js导出pdf操作
Nov 13 Javascript
关于JS中的作用域中的问题思考分享
Apr 06 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+sqlite数据库操作示例(创建/打开/插入/检索)
2016/05/26 PHP
php生出随机字符串
2017/07/06 PHP
PHP大文件分块上传功能实例详解
2019/07/22 PHP
阿里对象存储OSS在laravel框架中的使用方法
2019/10/13 PHP
更优雅的事件触发兼容
2011/10/24 Javascript
Javascript四舍五入Math.round()与Math.pow()使用介绍
2013/12/27 Javascript
javascript中2个感叹号的用法实例详解
2014/09/04 Javascript
node.js中的fs.write方法使用说明
2014/12/15 Javascript
jquery地址栏链接与a标签链接匹配之特效代码总结
2015/08/24 Javascript
浅析BootStrap栅格系统
2016/06/07 Javascript
Jquery Easyui搜索框组件SearchBox使用详解(19)
2016/12/17 Javascript
详谈jQuery Ajax(load,post,get,ajax)的用法
2017/03/02 Javascript
简单实现jQuery上传图片显示预览功能
2020/06/29 jQuery
聊聊那些使用前端Javascript实现的机器学习类库
2017/09/18 Javascript
微信小程序画布圆形进度条显示效果
2020/11/17 Javascript
vue+element加入签名效果(移动端可用)
2019/06/17 Javascript
[51:11]2014 DOTA2国际邀请赛中国区预选赛5.21 LGD-CDEC VS DT
2014/05/22 DOTA
py2exe 编译ico图标的代码
2013/03/08 Python
windows系统中python使用rar命令压缩多个文件夹示例
2014/05/06 Python
Python实现脚本锁功能(同时只能执行一个脚本)
2017/05/10 Python
Django objects.all()、objects.get()与objects.filter()之间的区别介绍
2017/06/12 Python
python中lambda()的用法
2017/11/16 Python
python检测IP地址变化并触发事件
2018/12/26 Python
python中实现控制小数点位数的方法
2019/01/24 Python
python os模块简单应用示例
2019/05/23 Python
Python线程threading模块用法详解
2020/02/26 Python
最新PyCharm 2020.2.3永久激活码(亲测有效)
2020/11/26 Python
CSS3点击按钮实现背景渐变动画效果
2016/10/19 HTML / CSS
在HTML5 canvas里用卷积核进行图像处理的方法
2018/05/02 HTML / CSS
Lou & Grey美国官网:主打舒适性面料服饰
2017/12/21 全球购物
我能否用void** 指针作为参数, 使函数按引用接受一般指针
2013/02/16 面试题
交通事故协议书范文
2014/10/23 职场文书
2014年学校党建工作汇报材料
2014/11/02 职场文书
幼儿园大班毕业评语
2014/12/31 职场文书
大学生旷课检讨书1000字
2015/02/19 职场文书
校运会班级霸气口号
2015/12/24 职场文书