给应用接上后端存储能力
云开发平台官网: https://workbench.aliyun.com/
案例一:用RDS数据库实现Todolist
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLiAzNfRHLGZkRGZkRfJ3bs92YsYTMfVmepNHLzkFROVTT61UNJpHW4Z0MMBjVtJWd0ckW65UbM5WOHJWa5kHT20ESjBjUIF2X0hXZ0xCMx81dvRWYoNHLrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdssmch1mclRXY39CXldWYtlWPzNXZj9mcw1ycz9WL49zZuBnLxQTM1ADMzMjM1IjMxAjMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
1. 资源准备
- 创建VPC和交换机
- 创建vpc
- 填写vpc名称和交换机名称,选一下可用区即可
- 创建成功后如下
- 创建RDS实例
- 实例创建
这里计费方式我们选择`按量计费`就好了,部署方案选择单可用区部署,实例规格选择最便宜的就好了
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225205507133.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
然后进行实例配置,选择我们刚才创建的VPC,这里选择可用区的时候发现没有,我们看到下面可用区配置是H,我们创建的交换机可用区是B,可以重新创建一个可用区H的交换机(需要把上面创建的交换机先删除掉)
刷新一下就可以看到刚才创建的交换机了,其他默认就ok
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225210402651.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
- 创建数据库,获得数据库名
数据库创建好以后,我们可以通过在线的方式进行访问【访问前要创建账号,查看下一步】
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225212220833.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
- 创建账号,获得用户名密码
- 添加白名单,交换机的IP段
- 登录数据库建表,创建表代码下面会讲到
`网络`选择刚才创建的VPC,添加一条入规则:目的为`MySQL(3306 )`,`源`选择我们刚才创建的VPC网段,然后点击创建就好了
2. 云开发平台
- 在云开发平台创建一个空应用,创建教程可以查看此篇文章👉 Web训练营Day01——创建应用 ,示例模板选择
Midway Serverless MySQL数据库示例
如下为我创建的应用
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225211307880.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
- 点击
跳转到 IDE,查看开发部署
文件,里面有创建数据库表代码,我们直接在RDS中执行语句就okREADME.md
- 环境管理
- 应用配置
这边的配置填我们创建的数据库的对应信息就好
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225214139938.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
- 部署
- 首先 install 一下
阿里云-云开发平台存储篇——给应用接上后端存储能力给应用接上后端存储能力 - install 完成后,点击部署即可
部署成功后会有一个临时域名,进行访问即可
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225221149905.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
案例二:用Nas存储文件
云开发平台集成了NAS功能![]()
阿里云-云开发平台存储篇——给应用接上后端存储能力给应用接上后端存储能力
- 创建应用
- 应用环境管理
- 部署,访问
部署成功后访问临时域名即可
案例三:用OSS上传和展示图片
可参考官方解决方案: OSS文件浏览器直传方案
- 创建OSS-bucket
- 创建
填写名称,将公共读打开
- 设置跨域
- 创建RAM子账号 ,AK,SK,授权OSS访问
- 创建子账号
可以看到ak和sk
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201225222846829.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5MzM5NDY3,size_16,color_FFFFFF,t_70)
- 创建目录
- 用户添加权限
- 应用配置管理
- OSSBUCKET:OSS的bucket名称
- OSSDIR:目录
- REGION:地域
- AKID:ak
- AKSK:sk
- 添加静态页面 index.html,添加接口 osstoken.js
- 直接从官方解决方案中复制前端
代码即可index.html
- 直接从官方解决方案中复制前端
- 添加接口,同样直接从官方文档中复制即可
- 添加路由
部署成功后,访问临时域名即可
实践:Midway Serverless + OTS Serverless 数据库快速开发 Todo List
1. 创建 OTS 资源
- 创建实例
- 创建数据表
-
- MIDWAY_OTS_ACCESSKEY 阿里云账户 AccessKey ID
- MIDWAY_OTS_SECRET 阿里云账户 AccessKey Secret
- MIDWAY_OTS_ENDPOINT 表格存储实例公网访问地址
- MIDWAY_OTS_INSTANCE 表格存储实例名称
创建ak: https://ram.console.aliyun.com/manage/ak![]()
阿里云-云开发平台存储篇——给应用接上后端存储能力给应用接上后端存储能力 存储桶公网和实例名称![]()
阿里云-云开发平台存储篇——给应用接上后端存储能力给应用接上后端存储能力 ![]()
阿里云-云开发平台存储篇——给应用接上后端存储能力给应用接上后端存储能力
- 部署运行
- npm install 一下
- 部署
- 部署成功访问临时二级域名即可