uni-app + uniCloud全栈开发微信小程序初体验
虽然身为前端开发人员,但对设计、后端也有一些兴趣的,也想从头到尾做自己独立做一个项目,为此就瞄上了云开发,之前也用过微信云开发玩过,但是搭配uni-app还是差点,所以看了两遍unicloud文档后就上手了,毕竟之前有微信云开发的基础,还是很容易上手的。这里展示一些踩过的坑和项目里主要的功能点,可给入坑的同学一些参考:1.建议admin和client分开,不然很容易相互影响出问题,这里的影响主要是
·
虽然身为前端开发人员,但对设计、后端也有一些兴趣的,也想从头到尾做自己独立做一个项目,为此就瞄上了云开发,之前也用过微信云开发玩过,但是搭配uni-app还是差点,所以看了两遍unicloud文档后就上手了,毕竟之前有微信云开发的基础,还是很容易上手的。
这里展示一些踩过的坑和项目里主要的功能点,可给入坑的同学一些参考:
1.建议admin和client分开,不然很容易相互影响出问题,这里的影响主要是某端更新忘了同步导致代码覆盖。不如分开清晰明了,好维护。
2.关于云函数的自动任务,看着文档我是找了半天都没找到,原来竟然是在控制台云函数详情里面,可看下图。
3.公共参数、方法等
在common文件里创建公共函数,这里可以是公共数据,方法。
使要引入的的云函数文件里执行npm y -init,然后再次执行npm install ‘…/common/你的公共函数’,require引入就可以使用了。
4.获取微信用户openid,这里直接贴出代码。
// 微信官方获取openid链接
const loginUrl = 'https://api.weixin.qq.com/sns/jscode2session'
const wxlogin_data = {
appid: appid,
secret: secret,
js_code: data.code
}
// 获取openid
const res = await uniCloud.httpclient.request(loginUrl, {
data: wxlogin_data,
dataType: 'json'
});
const openid = res.data.openid;
5.获取小程序码,还是贴出代码(有注释)。
// 获取access_token
const access_token = await uniCloud.httpclient.request(`https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${appid}&secret=${secret}`, {
dataType: 'json'
})
// 这里存一下access_token,因为access_token有效期是2小时,重复获取会导致之前的失效
if (access_token.status == 200) {
await db.collection('settings').add({
name: 'access_token',
value: access_token.data.access_token,
time: new Date().getTime(),
create_time: getServerTime(),
update_time: ''
})
const weappCode = await uniCloud.httpclient.request(`https://api.weixin.qq.com/wxa/getwxacode?access_token=${access_token.data.access_token}`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
data: {
path: data.path // 微信小程序页面路径,里面也包含着参数
}
})
// 这里最终获得的是buffer数据,到前端转一下就行
return returnFormat(1, poster2.data, '获取成功')
} else {
return returnFormat(0, access_token, 'access_token获取失败')
}
6,最后贴一下我的小程序码,欢迎体验。
更多推荐
已为社区贡献1条内容
所有评论(0)