微信小程序云开发初体验：给前端带来便利，后端地位暂未撼动
[]
2018年9月，微信正式发布了云开发平台，这一举措犹如投石入水，激起了层层波澜。那么，云开发究竟是什么呢？它是否意味着我们今后可以告别后端研发？又是否预示着前端研发将能独揽微信小程序的江山？这不禁让人心生一丝激动之情。
2018年9月，微信正式发布了云开发平台，此举犹如投石入水，激起层层波澜。那么，什么是云开发呢？这难道意味着我们以后可以与后端研发团队挥手告别了吗？难道这意味着未来的前端研发人员能够独揽微信小程序的开发大权了吗？哎呀，我这是在自我膨胀吗？我这是在骄傲了吗？我这是嘴角都在流口水了吗？不过，一想到这些，心中不禁有些小激动。
好了，好了，后端的小伙伴们可以放下手中的工具了，目前这个微信小程序的云功能还未能完全替代你们在微信平台上的作用，然而！必须承认，它为前端开发带来了极大的便捷，非常值得前端开发者们深入研究和探索。
1.什么是云开发？
开发者可通过云开发获得全面的云端服务，降低对后端技术和运维工作的依赖，无需自行搭建服务器。他们可以利用平台提供的API进行核心业务开发，从而实现快速部署和持续更新。此外，这一功能与开发者目前使用的云服务相协调，不存在冲突。
也就是说，针对某些小程序，我们不需要构建后端服务器和数据库，整个项目的开发可以完全由前端开发者独立完成。这样一来，前端开发者无需担忧服务器搭建等问题，便能够顺利地完成微信小程序的开发。
2.云开发功能简介
既然已经絮叨了这么久，相信你此刻早已急切地想要一探究竟，揭开那层神秘的面纱。
2.1 云开发基本步骤
常言道，“巧妇难为无米之炊”，因此，我们得先着手下载微信官方提供的最新版开发工具，至于下载链接，我已经为您准备好了。
在启动界面中，若您选取“创建云开发快速启动模板”，便能够直观地浏览到以下开发平台。
其中，系统默认会建立两个文件夹，分别为：
– 默认存放云函数的文件夹
– 默认存放业务代码的文件夹
若您觉得这名字略显俗气，不妨给它赋予一个更加典雅尊贵的新名。唯有专属定制的名字，方能彰显我那无可比拟的非凡气质。
比如说：李狗蛋和王钢柱…
请大家务必留意，更改姓名之后，必须确保在 ..json 文件中对相应的云函数及程序路径进行更新，否则小程序将因找不到匹配的入口文件而出现错误提示。
2.2 云开发切换环境
留心的同学们或许会注意到，云函数的目录名后缀有一个“-demo”标识，这代表着当前所使用的云函数环境。那么，这个云环境究竟有何作用呢？
云开发具备实时更新上线的特性，若你已将小程序版本上线，在本地进行开发时对数据库及云函数逻辑进行实时调整，那么依托同一环境的线上小程序亦会随之频繁变动。试想，用户面对着自己界面不断变化的小程序，脸上露出困惑的神情，这岂不是显得有些顽皮？
好在，微信给每位开发者提供了两套环境：
环境之大，
一次用不下，
一个上线，
一个开发！
每个环境的数据库或云函数均保持独立状态，只有当测试环节确认无误后，才会将其部署至线上平台。然而，新的疑问随之产生，我们该如何在需要时切换至不同的云环境使用呢？
在云函数文件夹进行右键操作，若曾更改过工作环境，将呈现两个可选环境；若未曾更改，请点击“更多设置”选项，随后在弹出的新窗口中挑选您当前所需的环境。
好了，环境准备好后，让我们开始愉快的（踩坑）开发之旅吧！
3.云开发的三大”拦路虎”
曾有一位知名人士沃·滋基硕德曾这样告诫我们：“在追求成功的征途中，你难免会遇到重重阻碍，切勿沮丧，时间久了，你便会逐渐适应。”
云开发涵盖三大核心要素：云函数、数据库以及存储管理。这些内容如同拦路巨兽，横亘在我们面前。在运用过程中，我们需关注以下几点：让我逐一细说。
3.1 大虎：云函数
何为云函数？
云函数即是在云端运行的代码片段，它不需要用户进行服务器管理，开发者只需在开发工具中编写并一键上传部署，即可使后端代码得以执行。
在代码区域的云函数文件夹中，我们可以通过右键点击来创建一个新的node.js函数，随后系统会询问我们是否需要安装相应的依赖项。
若要在云函数内执行数据库操作、管理云存储文件、调用其他云函数等任务，官方推荐使用名为wx--sdk的npm包来完成这些工作。但需留意，若在mac操作系统上不小心遗漏了依赖的安装，那么将无法恢复，岂不是连一个改正的机会都不给予？这不正应了那句话，浪子回头金不换，可人家连个后悔的机会都不给啊！幸运的是，我们得以采取迁回策略，于本地文件系统中搜寻到该云函数的存储目录，并在 CMD 终端界面输入以下指令：
npm install --save wx-server-sdk@latest
然后再上传部署该云函数，这样就可以引入依赖了。
云函数的使用方式如下：
exports.main = (event,context) => { let { userInfo,a,b} = event let { openId,appId} = userInfo // 这里获取到的 openId 和 appId 是可信的 let sum = a + b return { openId,appId,sum } }
该部分不仅囊括了小程序端在调用此函数时传递的各项参数，而且亦包含了用户的登录状态信息，以及小程序自身的相关资讯。
该对象涵盖了当前所引用的调用细节以及服务执行时的状态，借助它，我们可以全面掌握服务的运行状况。
这里尤为关键的是，每个客户端用户都拥有独一无二的标识，服务端能够借助这些标识来辨别不同的用户。然而，当我们满怀期待地尝试运行获取这些标识的示例代码时，却意外地遇到了错误：
查看错误提示时发现并未获取到该云函数，然而在云开发平台上，该云函数却清晰可见。这究竟是怎么回事呢？况且，它还是官方提供的示例代码，按理说不应出现错误。
此刻，不妨稍作停顿，进行一番思考，鉴于存在两套开发环境，我们是否还需设定小程序端所调用的云端环境呢？
心中豁然开朗，随即在 app.js 文件中进行操作，初始化云函数，并准确设定所需的云开发环境。
wx.cloud.init({ env: '使用云开发环境的ID',traceUser: true }
类似的，云函数在初始化时，同样需要对云开发环境进行定义，
// 云函数入口文件 const cloud = require('wx-server-sdk') cloud.init({ env: 'demo-id' }) const db = cloud.database(); exports.main = async (event,context) => { return db.collection('todos').get() }
这样，上述云函数便已成功访问了位于‘demo-id’云环境中的数据集。需留意的是，此次访问所使用的环境可能与当前的开发环境并非同一系统。
3.2 二虎：数据库
数据库的界面如下图所示：
改变数据库有四种方法：
– 1.云开发平台添加记录；
– 2.云开发平台导入数据；
– 3.微信小程序端改变数据库；
– 4.云函数端改变数据库；
正如俗话所说，“尺有所短，寸有所长”，世间万物无不如此，无论是物品还是智慧，总有其不足之处。这四种方法，各具其独特的优势：
云开发平台新增了记录功能，操作简便快捷，但存在一定的不足，即每条数据的录入需逐个进行，略显不便。
在云开发平台上进行数据导入时，能够实现大量数据的同步导入，操作过程迅速高效。但需留意的是，导入的JSON数据与常规的JSON格式有所区别，它是以对象为单位进行分割的，且对象之间并不包含逗号，具体格式如下所示：
{ "_id":"todo-identifiant-aleatoire","_openid":"user-open-id","description":"learn cloud database","done":false } { "_id":"todo-identifiant-aleatoire-2",0);">"write a novel",96);">false }
小程序端在修改数据库时，常常包含业务逻辑，却受到不同权限的约束。新增的数据通常都会自动包含一个唯一标识符_id，以及一个标识创建者（即小程序用户）的标识。通过这些信息，我们可以区分不同的用户。同时，这也意味着某个用户无法对其他用户的数据进行操作，确保了数据的安全与稳定。
云函数端对数据库进行操作，与小程序端做法相似，它提供了函数名称“name”，以便小程序进行调用。以下是小程序端调用云函数的具体步骤：，
wx.cloud.callFunction({ name: ‘云函数名字',data: { //传入云函数的参数 },success: res => { //调用成功后的函数 },fail: err => { //调用失败后的函数 } })
显而易见，云函数同样具备业务处理能力，然而它与小程序在数据库操作上存在差异——云函数是在服务端运行的，且拥有至高无上的权限，可以随意处置权限，不受约束地对数据库进行增、删、改、查等操作。
综合来看，我们可通过云开发平台的导入功能来初始化json数据，接着运用该平台对数据进行细致的修改，随后在微信小程序端对数据库进行操作，向其中添加数据。通过自动引入特定标识，能够有效区分用户信息。若需获取更高级别的权限，则可利用云函数对数据库执行操作，并将调用权限传递至小程序端。
3.3 三虎：存储管理
云开发平台所面临的最后一个挑战是云存储管理问题，这一环节默默无闻，对任何需要保存的数据都敞开大门，毫无异议地接纳。其操作界面可参考下方的图示。
观察上图可知，点击“上传文件”按钮，便能在云开发平台进行文件的上传操作。同时，利用微信小程序的特定功能，也能实现文件的上传。需要注意的是，务必创建新文件夹来有序管理存储数据，否则，将来堆积如山的存储文件将成为你难以摆脱的烦恼。
图中标注的是文件的存放位置，不论是从云开发平台还是客户端上传的文件，系统都会自动为每个文件指定一个。此外，还可以利用微信小程序的特定功能来上传文件。以下云函数的代码示例便展示了如何使用存储管理中保存的文件，并将其返回给小程序端进行调用。
-server-sdk') cloud.init() // 云函数入口函数
上述内容已阐述了文件在云端存储的具体位置，那么在小程序中，我们应如何指定将文件上传至云存储的具体路径呢？
若要在小程序中实现将本地图片上传至云端服务器的功能，我们必须首先确定该图片在本地存储的临时访问路径。
wx.chooseImage({ //选择手机图片 chooseEvt(){ let that = this; wx.chooseImage({ count: 1,sizeType: ['original',0);">'compressed'],0);">sourceType: ['album',0);">'camera'],success(res) { // tempFilePath可以作为img标签的src属性显示图片 res.tempFilePaths中的数据，即临时文件路径数组，被赋予变量tempFilePaths。0]; that.setData({ chooseImg: tempFilePaths }) 执行上传图片操作，针对临时文件路径数组。 } }) }
下面是上传到服务器的代码：
uploadImg(tempFilePaths){ let str = tempFilePaths; let name = str.split('.').reverse()[1] +'.'+str.split(0]; let names = name.split('//')[1]; let that = this; wx.cloud.uploadFile({ cloudpath: 'swiperImg/'+names,filePath: str,// 小程序临时文件路径 success: res => { that.setData({ imageId: res.fileID }) },fail: err => { console.log(err) } }) }
wx.. 参数所携带的信息即是文件在服务器上的存放路径。鉴于前文已展示出处理结果，我便不再保留悬念，采用的是相对路径而非具体的存储路径“://-demo-.636c--demo-//”。此外，为了简化操作，我们直接采用了上传文件的原有名称。然而，请注意！需特别注意，手机与电脑版上传文件的路径存在差异，具体来说，当我们在电脑端上传图片时，所获得的临时文件存储位置为：
该图片链接为"http://tmp/wx81c95cafc368ba2d.o6zAJsxvC5wiHIIVQOpRPFVOADDM.NLBDb9oLxX1D1f412643685c68c106d42e1757f77691.png"，请勿随意修改。
而手机端得到的 则是：
观察发现，手机端获取的地址与文件头部存在差异，其中并未包含“·”符号。若依照代码示例，以“·”为依据对地址进行分割，手机端获取的name将附带“://”，导致将其保存至云端存储时，会持续显示“路径错误”的提示。然而，在电脑端进行调试时，由于返回的图片临时路径含有多个“·”，便不会出现此类问题。提及此事，不禁让人回忆起初次遇到这一问题时，曾一度怀疑云函数是否还需经过某种上线流程，才能在手机端显现效果。
4.说说心里话
微信云开发功能的推出，赋予了前端开发者独立构建微信小程序的权限。这一功能的问世，迅速吸引了众多开发者的目光。鉴于其推出时间尚短，开发过程中遇到的问题往往难以在现有资料中找到对应解决方案，开发者们不得不频繁查阅官方文档并进行调试。尽管官方设有论坛供交流，但在迫切需要解答时，最终还是需要依靠自己。
实际上，官方发布的API文档中，大部分内容并未提供详细说明。文章末尾提供了官方文档的链接，其中内容阐述得相当详尽。本文意在在云开发的使用过程中，归纳并分享所遇到的问题，以供大家参考，并期待各位读者在微信小程序的使用体验上留下宝贵意见。
最后，诚挚邀请您关注“全站探索”公众号，这里聚集了一群热衷于技术、深入研究技术的同仁。我们每周都会发布精心准备的文章，期待您的热情关注！