前言
为了解决原生开发文件太多的痛点，自己搞了一套单文件解析框架，详情见 《介绍一个小程序预处理器》。在做这个框架的时候微信还没有推出云开发，所以设计之初也完全没有考虑云开发相关的内容，这次记录下为了兼容云开发做的一些调整。
框架的关键问题
每次执行 npm run dev 时，都会清空 dist 目录下的所有文件，并将编译文件重新填充到该目录下。在云开发推出之前，一切都显得特别自然毫无毛病，但是云开发推出之后，就暴露了一个特别关键的问题，因为云开发的配置信息是需要填写到 project.config.json 中的，而该文件也是在 dist 目录下，也就意味着，每次执行编译，该文件都会被删除，云开发的配置信息也会被删除。
调整后的效果
先看疗效，再看过程。先来看看调整完毕后，如何在代码中执行云函数。下面是一行获取微信步数的代码，仅需一行代码，就可以通过云函数解密微信运动数据。
this.$cloud.getRunData().then(res => console.log(res));
具体调整过程
1. 配置云函数
找到 dist 目录下的 project.config.json，添加下面两行配置
"miniprogramRoot": "miniprogram/", // 小程序根目录
"cloudfunctionRoot": "miniprogram/cloudFunctions/", // 云函数根目录
2. 配置框架输出目录
框架的默认输出目录是 dist，但是是可以通过配置调整的，在根目录下新建 mpp.config.js，配置如下：
module.exports = {
// 解析输出目录
dist: 'dist/miniprogram',
// 需要复制的文件拓展名
needCopyExts: ['js', 'jpg', 'jpeg', 'png', 'svg', 'gif', 'json'],
};
3. 编写云函数
在src目录下新建 cloudFunctions 文件夹，可以在该目录下编写云函数，这里以 decodeData 为例
src/cloudFunctions/decodeData/index.js
const cloud = require('wx-server-sdk')
cloud.init()
// 云函数入口函数
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
return {
event,
openid: wxContext.OPENID,
appid: wxContext.APPID,
unionid: wxContext.UNIONID,
}
}
src/cloudFunctions/decodeData/package.json
{
"name": "decodeData",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"wx-server-sdk": "~1.6.0"
}
}
4. 编译项目
在根目录下执行 npm run dev，并用微信开发者工具打开 dist 目录
5. 部署云函数
- 如果该小程序还没有创建云开发环境，点击微信开发者工具左上角的云开发按钮进行创建。
- 在微信开发者工具自带的编辑器中右键
decodeData文件夹，选择创建并部署：所有文件
6. 在项目中调用云函数
在项目中 通过 wx.cloud.callFunction 可以调用云函数，这里进行了简单的封装，封装过程可参考《增强Page能力》
/*
* 解密微信运动步数
*/
function getRunData() {
return new Promise((resolve, reject) => {
wx.getWeRunData({
success: res => {
wx.cloud.callFunction({
name: 'decodeData',
data: {
weRunData: wx.cloud.CloudID(res.cloudID),
}
}).then(res => {
resolve(res.result.event.weRunData.data.stepInfoList);
}).catch(err => reject(err));
},
});
})
}
module.exports = {
getRunData,
}
7. 在业务逻辑中调用
在具体的业务场景中，仅需一行代码就可以获取到微信运动步数。
this.$cloud.getRunData().then(res => console.log(res));
如有疑问欢迎留言！