个人案例
- GeekTimeAI
canvas应用:摇一摇,抽取新年签,生成分享海报。
GeekTimeAI扫码体验
- 【已成功】只用云开发,如何发送公众号模板消息?
下发统一消息接口回收后,如果你只有云开发,没有服务器和域名,不妨尝试使用本文的方法来发送公众号模板消息。 前提: 小程序和公众号同主体且已绑定到同一个微信开放平台账号。 思路推理: 小程序用户访问任意云函数都可以拿到小程序openid和unionid,提前将它们保存到云数据库用户集合中。 发送模板消息: 使用云函数A发送模板消息,需要调用公众号发送模板消息的接口,调用接口需要用到公众号的access_token。 获取和保存access_token: 使用云函数B获取access_token,推荐使用Stable Access token接口获取,减少出错率,云函数B可固定IP。因接口有日调用限制且access_token默认2小时过期,获取到access_token之后需要保存到云数据库中。为防止access_token过期,推荐云函数B设置定时触发,每隔1小时执行一次去重新获取access_token保存到云数据库中。 使用最新access_token: 每次发模板消息时从云数据库查询最新的access_token记录,发送模板消息需要用到公众号的openid。 获取公众号openid: 将小程序的云环境共享给公众号,小程序可使用云函数C来获取公众号的openid和unionid。如何操作呢? 1、使用云开发静态网站制作一个授权页面D,在该页面中访问云函数C,使用静默授权方式访问在云函数C即可获取到访问用户的公众号openid和unionid。 2、小程序使用webview来访问页面D,授权成功后在页面显示公众号的二维码,提示用户关注公众号获取通知功能。 将小程序和公众号用户关联: 通过上述引导用户获取到的公众号unionid来查询云数据库中的用户信息,保存公众号的openid到用户信息中。 经历以上安排之后,小程序云数据库的用户集合中,用户信息已经包含了小程序openid、unionid、公众号openid,到发消息的时机就可以发了。
2023-09-24 - 小程序开发新能力解读
这个月小程序释放了什么新能力?又有哪些新规则?收藏课程,及时了解小程序开发动态,听官方为你解读新能力。
2023-01-17 - 小程序性能优化实践
小程序性能优化课程基于实际开发场景,由资深开发者分享小程序性能优化的各项能力及应用实践,提升小程序性能表现,满足用户体验。
10-09 - 开源的抽奖助手小程序
发现开源小程序之美三-抽奖助手小程序 发现开源小程序之美一,个人博客小程序 https://developers.weixin.qq.com/community/develop/article/doc/000a40e13ec550274e2a9addd56413发现开源小程序之美二,微慕WordPress小程序 https://developers.weixin.qq.com/community/develop/article/doc/000c44945dc728ab9c2aff2a55b013发现开源小程序之美三,抽奖助手小程序 https://developers.weixin.qq.com/community/develop/article/doc/0002846854056847b66a2d13451013发现开源小程序之美四,在线答题小程序 https://developers.weixin.qq.com/community/develop/article/doc/00040af07005609a223acee0151413发现开源小程序之美五,营销组件库 https://developers.weixin.qq.com/community/develop/article/doc/000c4235c98740a1dc2a1a6045b013发现开源小程序之美六,酱茄小程序 https://developers.weixin.qq.com/community/develop/article/doc/00040ede6d0388082a3aeb49b57813发现开源小程序之美七,二手书商场 https://developers.weixin.qq.com/community/develop/article/doc/0006ceb61a87182a4b3a1b32a5bc13发现开源小程序之美八,我要戴口罩https://developers.weixin.qq.com/community/develop/article/doc/0006a047b0cee0d5713ad731f5b813发现开源小程序之美九,失物招领小程序 https://developers.weixin.qq.com/community/develop/article/doc/000ca6a3b28ce8857b5a8bb3351c13发现开源小程序之美十,旅游攻略方面的微信小程序 https://developers.weixin.qq.com/community/develop/article/doc/000cc694e9c790ce755aee41556013 这个小程序是身边小伙伴开发的,基于云开发的一个抽奖助手小程序,我今天clone下代码,花了不到10分钟就运行成功了, 值得推荐给大家 先上截图大家参观下 [图片] 1 [图片] 2 [图片] 2 码云地址 https://gitee.com/xiaofeiyang3369/wechatlottery 我在调试过程中做了略微的改动 部署步骤建议按照下面三步走 第一步:创建集合,并将集合权限设置为:所有人可读,仅创建者可读写 第二步:将data里面的lottery.json文件导入到lottery集合 第三步:部署云函数 如没有意外就可以正常运行了,部署过程中遇到任何问题,请评论席留言。 更新记录 2020-07-20 重写了核心逻辑 ①开奖逻辑 ②抽奖逻辑 开奖逻辑目前是按照时间维度,到了时间不管人数有没有凑够都会进行开奖,开奖五分钟后,进行抽奖,确定中奖名额。 具体规则: (1)每个整点的1分去检测,根据当前时间检测是否有需要开奖的 (2)每个整点的5分去检测,是否有开奖未抽奖的,如果有,确定中奖名额 ~~
2021-01-25 - 小程序如何定位所在城市,如何发起周边搜索
app上常见的自动切换本地城市,还有见到有些小程序中个人账号可以获取位置服务,整理了一些封装方法 先封装request 为小程序get/post的promise封装 rq.js [代码]/* * url {String} 请求地址接口 * data {Object} 请求参数 * param {Object} request参数 * method {String} 指定使用post或者是get方法 */ export function request(url, data={}, param={}, method='POST') { return new Promise((resolve, reject)=>{ let postParam = { url, method, data, // timeout // dataType // responseType header: { 'content-type': 'application/json' // 默认值 }, success(res) { resolve(res) }, error: function (e) { reject(e) } } postParam = Object.assign(postParam, param) postParam.fail = postParam.error if (postParam.url) wx.request(postParam) }) } module.exports = { get(url, data, param){ return request(url, data={}, param={}, method='GET') }, post(){ return request.apply(null, arguments) } } [代码] 位置服务方法 需要开通小程序的位置服务功能,在小程序控制台 [图片] 简单的封装了三个位置服务的方法 所在地城市 地区搜索 范围搜索 [代码]// request的promise封装 const iKit = request('./rq.js') // key为开通位置服务所获取的查询值 // 下面这个key是随便写的 let key = 'JKDBZ-XZVLW-IAQR8-OROZ1-XR3G9-UYBD5' /* * 搜索地区... * 搜索地区的商圈, 如搜索 kfc 广州市 * key {String} 搜索内容 * region {String} 搜索区域 */ export function searchRegion(kw, region) { let opts = { keyword: encodeURI(kw), boundary: region ? `region(${encodeURI(region)}, 0)` : '', // 0 为限定范围搜搜索,1为开放范围搜素偶 page_size: 10, // 搜索结果分页最大条数 page_index: 1, // 指定分页 key } return new Promise((resolve, rej)=>{ iKit.get('https://apis.map.qq.com/ws/place/v1/search', opts).then(res=>{ resolve(res.data.data) }) }) } /* * 搜索附近的... * 以当前位置的经纬度搜索附近商圈,如附近的酒店,快餐等等 * key {String} 搜索内容 * params {Object} 搜索参数 包含三个参数 lat纬度,lng经度,distance范围(单位米) */ export function searchCircle(kw, params={}) { let {lat, lng, distance} = params if (!lat && !lng) return if (!distance) distance = 1000 // 搜索范围默认1000米 let opts = { keyword: encodeURI(kw), boundary: `nearby(${lat},${lng},${distance})`, orderby: '_distance', // 范围搜索支持排序,由近及远 page_size: 20, // 搜索结果分页最大条数 page_index: 1, // 指定分页 key } return new Promise((resolve, rej)=>{ iKit.get('https://apis.map.qq.com/ws/place/v1/search', opts).then(res=>{ resolve(res.data.data) }) }) } // 所在地的城市,省份等区域信息 /* * 所在地的城市,省份等区域信息 * 如当前地址所在省份、城市 * lat {Number} 纬度 * lng {Number} 经度 */ export function myCity(lat, lng) { return new Promise((resolve, rej)=>{ let opts = { location: `${lat},${lng}`, key } iKit.get(`https://apis.map.qq.com/ws/geocoder/v1/`, opts).then(res => { resolve(res.data.result) }) }) } [代码] 调用 [代码]wx.getLocation({ type: 'wgs84', success(location) { locationPosition = location // 所在地信息 myCity(location.latitude, location.longitude).then(res => { let myCityInfo = res.ad_info let {city, nation, province, city_code, adcode} = myCityInfo console.log({title: `国家: ${nation},省份: ${province},城市: ${city}`}) }) // 附近搜索 searchCircle('快餐', { lat: location.latitude, lng: location.longitude, distance: 500 }).then(res=>{ console.log(res) }) // 地区搜索 searchRegion('酒店', '广州').then(res=>{ console.log(res) }) } }) [代码] 关注小程序 [图片]
2020-02-10