云开发实战绘图留言板!云开发免费额度香不香? | 🏆 技术专题第七期征文

简介: 正式开始,这篇很长长长长长长长...

什么是云开发


要说什么是云开发,首先得来看看,在没有云开发的时代,身为全栈工程师,我们要掌握并完成哪些前置条件才可以开始写业务。


  • 一台服务器或虚拟空间


  • 域名(解析、备案、HTTPS证书


  • 安装服务端环境(python/php/nginx/apache/redis/node


  • 数据库(mysql/nosql/mongodb


我们可以开始写业务代码了...


可是光写代码还不算呐,你要是真自己一个人干,你还得掌握一堆运维相关的知识...


...年轻人不讲武德啊


云开发(Serverless)可以让你直接过上面那一堆麻烦


专注于闪电五连鞭的发招..


啊...不是


云开发可以让我们专注于业务逻辑的开发


微信小程序云开发


微信小程序于2018年末隆重推出微信小程序云开发模式,本人还参加了那一年的WeGeek黑客马拉松,获得了第5名的好成绩...咳咳...


1650847584(1).png


由于微信生态圈里的独立开发者众多,小程序云开发模式又如此的直击独立开发者的痛点,相信很多开发者都已经在产品中应用云开发了。


1650847616(1).png


  • 这样的羊毛薅起来不香吗?


开通注意事项


1650847646(1).png


不可使用测试号,必须自己注册一个Appid。


1650847685(1).png


新建云开发项目时会默认新建一个云开发的demo项目,里面详细的演示了如何使用云开发的各项能力,大家自己去看文档,这里就不多此一举凑字数了。


本文案例


我们利用云开发,做一个画画接龙留言板


留言板UI搭建


image.png


画图


image.png


云存储


  • canvas转临时文件转base64


wx.canvasToTempFilePath({
  canvasId: 'myCanvas',
  success: function (res) {
    wx.cloud.callFunction({
      name:"painterbbs",
      data:{
        act:"post",
        file:wx.getFileSystemManager().readFileSync(res.tempFilePath,"base64")
      },
      success:(result)=>{
        wx.hideLoading();
        console.log(result);
        that.setData({
          painterIsShow: false
        });
      }
    });
  }
})


  • 云函数接收参数并上传到云存储


let res = await cloud.uploadFile({
  cloudPath:"painterbbs/"+wxContext.OPENID+Date.now()+".png",
  fileContent:Buffer.from(event.file, 'base64')
});


云数据库


提交


db.collection("painterbbs").add({
  data:{
    openid:wxContext.openid,
    fileid:res.fileID
  }
});


读取


const res = await db.collection("painterbbs")
  .skip(event.page?event.page:0)
  .limit(10)
  .get();
return res;


删除


const res = await db.collection("painterbbs").doc(event.id).remove();
return res;


相关文章
|
2月前
|
前端开发 JavaScript
打造现代感十足的卡片式企业官网:HTML+CSS全攻略!
打造现代感十足的卡片式企业官网:HTML+CSS全攻略!
|
2月前
|
小程序 定位技术 API
从新手到行家:支付宝小程序开发的全景攻略
【8月更文挑战第27天】在数字化转型的大潮中,支付宝小程序作为连接商家与消费者的桥梁发挥着重要作用。本文以“美食地图”支付宝小程序为例,从项目概述、开发准备、开发实践、问题解决到最终总结,全面解析支付宝小程序的开发流程。从环境搭建到页面设计,再到业务逻辑实现,最后完成性能优化、测试与发布,详细介绍如何打造一款实用且用户体验优良的小程序。“美食地图”不仅让用户轻松搜索周边美食、查看评价和优惠信息,还能在线预约,极大地提升了便利性和满意度。通过实战案例分享,为开发者提供宝贵的经验参考。
38 0
|
人工智能 小程序 数据安全/隐私保护
分享几个免费设计生成工具 (第二期)
今天来给大家分享几个国外免费的设计生成工具
|
Java 定位技术 调度
「阿里开发者」微信公众平台9-10月阅读排行榜来袭!
今天,推出「阿里开发者」微信公众号双月阅读排行榜,希望读者可以从阿里人优秀的技术干货硬技能、个人经验软技能中得到成长的启迪!
|
开发者
【官方帖】各位宜搭开发者,晒一晒你的酷应用开发案例,评论留言吖~~~
快来晒一晒你的酷应用开发案例,有机会在宜搭服务窗/微信公众号等渠道进行宣传推广~ 如果有您有更好的酷应用开发场景,需要宜搭产研共创支持,欢迎评论留言
【官方帖】各位宜搭开发者,晒一晒你的酷应用开发案例,评论留言吖~~~
|
测试技术 开发者
「阿里开发者」微信公众平台双月阅读排行榜来袭!
更多优质技术内容,请关注「阿里开发者」微信公众平台!
1373 7
「阿里开发者」微信公众平台双月阅读排行榜来袭!
|
Serverless
【活动已结束】重温童年的“五子棋”,赢取专属阿里云 Serverless 证书和众多好礼
当古老的“五子棋”遇上最新最火热的Serverless,会擦出什么样的火花?一起来动手体验,赢取你的专属阿里云Serverless证书,更有众多好礼等你来抽。
【活动已结束】重温童年的“五子棋”,赢取专属阿里云 Serverless 证书和众多好礼
|
机器学习/深度学习
R爱好者福利|免费线上资源分享
最近有些R爱好者想要寻求R语言相关资料,以下为小编平常经常使用的免费开源的R语言资料,和大家分享。 其他统计,R语言书籍小编这也搜集了很多,但是由于版权等问题,不能直接分享,需要可后台联系,或者加小编微信(菜单:资料获取)。
235 0
R爱好者福利|免费线上资源分享
|
SQL 弹性计算 分布式计算
阿里云冬季实战营(第五期学习记录)
冬季实战营第五期:轻松入门学习大数据
|
人工智能 编解码 安全
下一篇
无影云桌面