【小程序云七天学习训练营】Day3

本文涉及的产品
函数计算FC,每月15万CU 3个月
简介: 第三天学习计划:云存储使用

云存储使用

mpserverless.file 对象提供 uploadFile 和 deleteFile方法管理文件。上传的文件将通过CDN进行网络加速。

步骤一:设置文件权限

小程序Serverless提供了一套简明易懂的JSON语法用来控制用户对资源的访问,类似于身份验证体系里的IAM或者网络安全中的ACL。您可以通过修改权限规则来管理文件权限。

小程序Serverless会为每个新建的文件自动提供一个默认权限规则。默认规则规定所有文件都只有资源所有者可以进行写操作,所有人可读。您可以在控制台上修改文件权限。

1.打开小程序云控制台,在云存储页面,单击权限图标。
2.修改权限规则,然后单击保存。
12.jpeg

上面的权限规则由多个子规则组成,每个子规则包含以下信息:

• 范围:用于定义规则生效范围。在数据存储的安全规则中,每一个规则的范围是一个文件(路径)。您可以通过文件路径指定一个特定的文件, 也可以通过JavaScript的正则表达式指代一批文件或使用星号(*)指代所有文件。

• 操作:用于定义生效范围内的特定操作。所有人都具有文件的读权限。.write代表写操作,* 代表所有操作。

• 策略:用于确定生效范围内的特定操作是否允许。默认没有标记为允许的操作,都是不允许的。策略是操作是否被允许的标记,可以是一个布尔值,或者是一个表达式。当策略冲突时,以最先出现的规则策略为准。如默认的权限规则策略表达式request.auth.userId == resource.auth.userId代表所有文件都只有资源所有者可以进行写操作,所有人可读。

步骤二:云存储操作

控制台操作

1.打开小程序云控制台,在云存储页面,单击上传文件。
2.单击直接上传或将文件拖拽至上传区域。
文件上传过程中,请勿刷新或关闭页面,否则上传任务会被中断且列表会被清空。
13.jpeg
3.上传成功后,您可以单击详情查看图片下载地址。

小程序端调用

1.在小程序项目的根目录执行以下命令安装 SDK。

npm install @alicloud/mpserverless-sdk --save

2.文件上传或删除。

// 选择文件上传
my.chooseImage({
  chooseImage: 1,
  success: res => {
    const path = res.apFilePaths[0];
    const options = {
      filePath: path,
      headers: {
        contentDisposition: 'attachment',
      },
    };

    my.serverless.file.uploadFile(options).then(console.log).catch(console.error);
  },
});
// 删除之前上传的文件
my.serverless.file.deleteFile('https://resource.bspapp.com/xxx-xx/4b82ded0-0118-4de4-9f50-ab13110a1ffb.jpg').then(res => {
  console.log(res);
}).catch(err => {
  console.error(err);
});

今日作业

实现在小程序中点击选择相册内图片上传,上传成功后,插入一条产品表的数据,产品图片url字段使用上传成功后返回的fileUrl字段。

相关实践学习
【文生图】一键部署Stable Diffusion基于函数计算
本实验教你如何在函数计算FC上从零开始部署Stable Diffusion来进行AI绘画创作,开启AIGC盲盒。函数计算提供一定的免费额度供用户使用。本实验答疑钉钉群:29290019867
建立 Serverless 思维
本课程包括: Serverless 应用引擎的概念, 为开发者带来的实际价值, 以及让您了解常见的 Serverless 架构模式
相关文章
|
5月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的学习自律养成小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的学习自律养成小程序的详细设计和实现(源码+lw+部署文档+讲解等)
|
2月前
|
小程序 JavaScript API
微信小程序开发学习之页面导航(声明式导航和编程式导航)
这篇文章介绍了微信小程序中页面导航的两种方式:声明式导航和编程式导航,包括如何导航到tabBar页面、非tabBar页面、后退导航,以及如何在导航过程中传递参数和获取传递的参数。
微信小程序开发学习之页面导航(声明式导航和编程式导航)
|
2月前
|
小程序 JavaScript
微信小程序学习之数据绑定,事件绑定,事件传参与数据同步的学习记录
本文介绍了微信小程序中的数据绑定、事件绑定、事件传参与数据同步的基本概念和使用方法,包括如何在data对象中定义数据、使用mustache语法在wxml中渲染数据、绑定和处理事件、事件对象属性、事件传参以及实现输入框与data数据的同步。
微信小程序学习之数据绑定,事件绑定,事件传参与数据同步的学习记录
|
3月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
109 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
3月前
|
小程序
关于我花了一个星期学习微信小程序开发、并且成功开发出一个商城项目系统的心得体会
这篇文章是作者关于学习微信小程序开发并在一周内成功开发出一个商城项目系统的心得体会,分享了学习基础知识、实战项目开发的过程,以及小程序开发的易上手性和开发周期的简短。
关于我花了一个星期学习微信小程序开发、并且成功开发出一个商城项目系统的心得体会
|
5月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的高校学习助手小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的高校学习助手小程序的详细设计和实现(源码+lw+部署文档+讲解等)
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的线上学习资源智能推荐系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的线上学习资源智能推荐系统附带文章源码部署视频讲解等
64 5
|
5月前
|
小程序 前端开发 JavaScript
微信小程序|英语学习交流平台小程序
微信小程序|英语学习交流平台小程序
|
5月前
|
小程序 前端开发 安全
微信小程序|大学生党务学习平台的设计与实现
微信小程序|大学生党务学习平台的设计与实现
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的在线互动学习网站附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的在线互动学习网站附带文章源码部署视频讲解等
32 1
下一篇
无影云桌面