ArthurSlog
SLog-68
Year·1
Guangzhou·China
Sep 11th 2018
ArthurSlog Page
GitHub
NPM Package Page
掘金主页
简书主页
segmentfault
常道无名 唯德以显之 至德无本 顺道而成之 祸福无门 惟人自召 善恶之报 如影随形
开发环境MacOS(High Sierra 10.13.5)
需要的信息和信息源:
小程序官方文档
开始编码
腾讯推出“云开发”概念,简单说,就是为开发者提供搭建好的服务器,服务器使用npm安装好了“wx-server-sdk”模块
腾讯就是把业务包装在模块里,然后在自己的平台提供的 API,供开发人员调用
开发人员可以借助平台进行核心业务开发,实现快速上线和迭代
云开发方式,可以和开发者已经使用的云服务相互并存
现在先把微信开发工具更新至最新(1.02.1809101)
云开发方式,需要appid,请准备好
新建一个小程序项目,选择“建立云开发快速启动模版”
项目建立之后,文件结构如下:
miniprogram/app.js
添加环境变量 env: ‘test-dxx7x’
保存修改
在模拟器中点击“点击获取openid”
在Console控制台里可以看到
函数配置
日志
监控
其中日志记录就可以当作是后端服务器的控制台了,相关的调用时间和记录都可以差的到
还有比较实用的日志筛选功能
现在点击左上角的“测试”按钮,可以对函数进行测试
点击“运行测试”
测试结果:失败
查看日志,如下:
cloudfunctions/arthurSlog_getInfo
这个文件是要放在服务器上,为我们的前端提供服务的
这个文件会提供一个“接口”供前后端交互
其中package.json文件里,包含了index.js代码的依赖关系
简单点说,index.js 里面会引用到 wx-server-sdk这个模块的方法
而这些引用的关系,就记录再package.json文件里面
我们可以看一下package.json文件里的代码:
cloudfunctions/arthurSlog_getInfo/package.json
package.json 是一份配置文件,只用来指导 npm工具做事的方案
npm工具,是nodejs语言的一个包管理工具,更多的使用方式 参考 npm官方手册
在我的 Slog57 和 Slog58两篇文章中,介绍了npm的使用和npm package(npm包)的制作、发布和更新
感兴趣的可以去翻阅一下
好了,回过头来,我们看回来微信“云开发”
让我们来打开刚刚创建的 arthurSlog_getInfo路径下的 index.js文件
同时添加代码:
cloudfunctions/arthurSlog_getInfo/index.js
编写完成之后,右键arthurSlog_getInfo文件夹,点击“上传并部署”
因为云函数中使用 wx-server-sdk 需在对应云函数目录下安装 wx-server-sdk 依赖
参考 微信官方说明
在创建云函数时会在云函数目录下默认新建一个 package.json 并提示用户是否立即本地安装依赖
请注意云函数的运行环境是 Node.js,因此在本地安装依赖时务必保证已安装 Node.js,同时 node 和 npm 都在环境变量中
如不本地安装依赖,可以用命令行在该目录下运行:
npm install —save wx-server-sdk@latest
ok,现在我们打开 miniprogram/pages/index/index.js 文件:
并添加前端代码:(用于向后端发起请求服务)
miniprogram/pages/index/index.js
然后,再打开 miniprogram/pages/index/index.wxml 文件
并添加页面代码,在页面上新建一个 button 组件与js里的方法 “arthurSlog_getInfo”绑定在一起
当点击按钮的时候,调用函数“arthurSlog_getInfo”,像云服务(后端)发起请求
miniprogram/pages/index/index.wxml
保存,在模拟器中,点击“点击向云端发起请求”按钮
观察控制台打印的信息:
点击展开 {errMsg 左边的小箭头展开:
可以看到云端服务返回的 appId 和 openId数据
至此,我们对微信“云开发”有了基础的了解和使用。
如果你喜欢我的文章 欢迎点赞 留言
谢谢
领取专属 10元无门槛券
私享最新 技术干货