云开发·云调用生成小程序码 小程序云开发已经支持云调用，开放了很多接口，一直想要的获取小程序码也支持了。这下轻量的小程序也可以有自定义小程序码的功能。 1. 需求 获得一个带参数的小程序码，传播出去以后，用户扫码进入指定页面，根据参数做不同的处理。本文只讲小程序码生成、存储、展示部分。参数处理不多介绍，可以查看 项目代码 了解更多。 2. 开通云开发 新建小程序可以从开发工具的云开发模板初始化项目，根据云开发操作指引新建项目即可。 但是这里有个问题，已发布小程序的页面才能生成小程序码。如果现有的小程序没有开通云开发，需要做以下几步： 开发工具开通云开发，设定云开发的环境； 将原来的代码（除了[代码]project.config.json[代码]以外的所有文件）放到新建的 [代码]miniprogram[代码] 目录； 新增 [代码]cloudfunctions[代码] 目录； [代码]app.json[代码] 新增配置 [代码]"cloud": true[代码]； [代码]project.config.json[代码] 配置 [代码]"miniprogramRoot":"miniprogram/"[代码] 和 [代码]"cloudfunctionRoot":"cloudfunctions/"[代码]； 修改小程序基础库版本，最低要 2.3.0 [代码]"libVersion": "2.3.0"[代码]。 3. 生成小程序码 下面可以开始写代码开发了，开始之前，建议先看完官方教程。特别是开发工具的使用步骤，开发和调试时如果遇到奇怪的问题，可以尝试重启开发工具、重装开发工具，也可以去微信开放社区发帖。(重启和重装都是我在社区中发现的答案，能解决各种不应该存在的问题)。 3.1 准备文件 在 [代码]cloudfunctions[代码]目录右键新建Node.js云函数 [代码]getqr[代码]。 生成小程序码需要单独指定权限。在 [代码]getqr[代码] 目录新建 [代码]config.json[代码] ，里面写以下内容： [代码]{ "permissions": { "openapi": [ "wxacode.getUnlimited" ] } } [代码] 小程序码的获取方式有三种，这里只用到了接口 getUnlimited，选择这个接口的原因是漂亮的圆形小程序码，数量无限制。具体区别可以去 获取小程序码官方文档查看详情。 正常情况下，这个时候云函数可以部署测试了。如果遇到部署不成功、各种权限问题，可以尝试本地部署上传所有文件、重启试试。 3.2 生成小程序码 生成小程序码的代码如下，可以指定页面和页面参数 [代码]scene[代码]，还有小程序码的尺寸。 注意这里的 [代码]scene[代码] 有限制: 最大32个可见字符； 只支持数字，大小写英文以及部分特殊字符：[代码]!#$&'()*+,/:;=?@-._~[代码]； 注意参数格式：下面实例代码生成小程序码后，扫码获得 [代码]pages/demo/demo?scene=id%3D6[代码] 。 [代码]try { const result = await cloud.openapi.wxacode.getUnlimited({ page: 'pages/demo/demo', scene: 'id=6', width: 240, }) console.log(result) return result } catch (err) { console.log(err) return err } [代码] 直接调用，比服务端调用少了 access_token 参数。 3.3 上传到云存储 返回值中的 buffer 就是图片内容，直接上传到云存储： [代码]const uploadResult = await cloud.uploadFile({ cloudPath: 'shareqr/' + qr_name_hash + '.jpg', fileContent: result.buffer, }); [代码] 我在云存储新建了 [代码]shareqr[代码] 目录保存小程序码； 图片名根据参数取md5摘要； [代码]getUnlimited[代码] 返回的图像是 [代码]jpeg[代码] 格式，后缀硬编码写 [代码].jpg[代码]。 3.4 获取图片临时路径 直接上代码 [代码]getURLReault = await cloud.getTempFileURL({ fileList: [uploadResult.fileID] }); fileObj = getURLReault.fileList[0] return fileObj [代码] 3.5 直接从存云存储获取 生成过以后图片已经保存在云存储，用同样的参数第二次调用没必要再生成一次，去掉一次网络请求，可以节省不少时间。 前面说到文件名使用请求参数摘要，知道了目录和文件名，再加上文件bucket前缀就可以拼出来 [代码]fileID[代码]，用[代码]fileID[代码] 可以查询云存储的文件。 比如我刚刚生成的 fileID 是 [代码]cloud://dev-xxxx.8888-dev-xxxx/qr/44ea42f05091c3bec771123e6e8cd4c2.jpg[代码]， 前缀就是 [代码]cloud://dev-xxxx.8888-dev-xxxx/[代码]。再拼上目录、文件名、后缀就是 [代码]fileID[代码]。 注：此处的 [代码]fileID[代码]拼接方法并不是来自官方文档，只是在使用中发现这个前缀不会变。还需要官方解释说明[代码]fileID[代码]规则。 如果会改变，就需要再用云数据库存储[代码]fileID[代码]，更麻烦一些。 3.6 云函数完整代码 [代码]// 云函数入口文件 const cloud = require('wx-server-sdk'); const crypto = require('crypto'); const bucketPrefix = 'cloud://dev-xxxx.8888-idc-4d11a4-1257831628/qr/'; // env: 'dev-xxxx' // 云函数入口函数 exports.main = async (event, context) => { const full_path = event.page + '?' + event.scene; const qr_name_hash = crypto.createHash('md5').update(full_path).digest('hex'); const temp_id = bucketPrefix + qr_name_hash + '.jpg'; // return { // full_path, // qr_name_hash, // temp_id // } try { // 先尝试获取文件，存在就直接返回临时路径 let getURLReault = await cloud.getTempFileURL({ fileList: [temp_id] }); // return getURLReault; let fileObj = getURLReault.fileList[0]; if (fileObj.tempFileURL != '') { fileObj.fromCache = true; return fileObj; } // 生成小程序码 const wxacodeResult = await cloud.openapi.wxacode.getUnlimited({ scene: event.scene, page: event.page, width: 280 //二维码的宽度，单位 px，最小 280px，最大 1280px }) // return wxacodeResult; if (wxacodeResult.errCode != 0) { // 生成二维码失败，返回错误信息 return wxacodeResult; } // 上传到云存储 const uploadResult = await cloud.uploadFile({ cloudPath: 'qr/' + qr_name_hash + '.jpg', fileContent: wxacodeResult.buffer, }); // return uploadResult; if (!uploadResult.fileID) { //上传失败，返回错误信息 return uploadResult; } // 获取图片临时路径 getURLReault = await cloud.getTempFileURL({ fileList: [uploadResult.fileID] }); fileObj = getURLReault.fileList[0]; fileObj.fromCache = false; // 上传成功，获取文件临时url，返回临时路径的查询结果 return fileObj; } catch (err) { return err } } [代码] 4. 小程序页面调用 调用页面就比较简单了，在小程序新建一个 [代码]pages/share/share[代码] 在 [代码]onLoad[代码] 函数调用云函数。 [代码]// 使用前记得先初始化云函数，一版放到 app.js onLaunch() 中 // wx.cloud.init({env: 'dev-8888'}) wx.cloud.callFunction({ name: 'getqr', data: { page: 'pages/demo/demo', scene: 'id=6', } }).then(res => { console.log(res.result); if (res.result.status == 0) { _this.setData({ qr_url: res.result.tempFileURL }) }else{ wx.showToast({ icon: 'none', title: '调用失败', }) } }).catch(err => { console.error(err); wx.showToast({ icon: 'none', title: '调用失败', }) }) [代码] 至此完整的调用过程已经全部完成，详细代码可以到 项目代码 查看。 代码中还对入口页面和share页面的参数做了包装，云函数可以直接使用，小程序可以稍做修改适应自己业务。 写在最后 小程序云开发已经开放了很多功能，除了这次提到的生成小程序码，云调用还可以发送模板消息。有需要的开发者又一个理由可以快速上线新功能了。 云开发还开放了[代码]HTTP API[代码]，也就是用自己的服务器调用云函数。以前看完云开发介绍文章最大的疑问就是，你说的都很好，可是后台数据怎么管理呢？不能跟自己的服务器结合，只能放一些轻量的小程序。有了 [代码]HTTP API[代码] 以后就可以用自己的服务器做管理后台了。这时候你要问，都用上服务器了，还需要云开发做什么。首先，云开发免费；其次，免费功能已经够强，就差不能做Web管理后台了；最后，获取access_token（小程序及小游戏调用不要求IP地址在白名单内。）

微信小程序自上线以来一直吸引着零售商家的注意，微信官方也不断为小程序提供流量补给，无论是搜索框、好物圈、下拉菜单、微信卡包……等流量入口都在为小程序引流。据不完全统计，微信上已经给小程序开放了64个流量入口。 但实际上，绝大多数的商家面对这些流量入口都非常被动，可以说是“靠天吃饭”为主，如何通过积极的运营抢占这些免费的流量入口？今天分享5个“核心动作”。 一、用好“附近的小程序” “附近的小程序”应该是微信为门店类小程序量身打造的一个功能，而这其实也是微信“连接线下”战略的重要部分。甚至有人预言附近的小程序将成为与美团对抗的本地O2O生活平台。虽然言之过早，但现成的流量，商家越早抓住越省成本！ 如何运营“附近的小程序”？在公众号后台接入该功能，添加地址（最多添加10个）后，大致可以分两个阶段运营“附近的小程序”： （1）顾客进店（指小程序）前。 这个阶段，商家能做的是增强“附近的小程序”页面上更多的功能展示（如点餐、外卖、到店自提、会员、优惠、买单），吸引用户点击获取服务。 [图片] （微信已经支持买单、外卖、会员、优惠、到店自提等功能） （2）顾客进店（指小程序）后。 商家小程序除了提供基础的商品与服务，还应该通过一些运营举措将顾客沉淀下来，例如提醒用户使用“添加到我的小程序”，为后期二次复购做铺垫——这也正好是接下来要讲的第二点。 二、激励用户“添加到我的小程序” 根据有赞小程序产品经理提供的数据显示，从“我的小程序”进入店铺的用户页面访问深度是其他入口的2倍及以上。因此，激励用户“添加到我的小程序”，将是提高小程序二次打开率的关键。 以有赞小程序为例，今年2月份，有赞已经上线了“添加至我的小程序引导浮层”功能，促进用户转化。 [图片] 除此之外，有赞还上线了“收藏有礼”功能，支持用户在将小程序添加到“我的小程序”后，将获得商家发放的奖励。有赞创始人白鸦曾公开透露，“收藏有礼”是有赞小程序商家使用效果最好的插件，KUOSE阔色、魅族、韩都衣舍、幸福西饼、裂帛、孩子王等商家都在通过该插件提高用户粘性。 [图片] 三、借力微信搜索 微信的日活用户已经达到11亿，相比百度App日活1.6亿，已经拉开了上十倍的差距。而搜索行为也将伴随着用户基数的增大而逐渐增加。已经有不少行业人士预测，微信搜索量即将超过百度搜索成为国内第一大搜索引擎。 如何借助微信搜索为小程序引流？目前有两大途径： 一是品牌官方专区和小程序搜索。 这完全属于用户自主搜索流量，前提得有较高的顾客认知度和品牌知名度。 [图片] 二是商品搜索结果页。 微信搜索对于电商小程序的流量倾斜已经非常明显。从2018年“618”为京东开闸引流起，微信搜索就已经步步为营，逐步为电商小程序开放流量。2018年双11前夕，微信搜索支持电商小程序的商品搜索，以有赞为主力的小程序服务商开发的小程序纷纷出现在微信商品搜索结果页。 [图片] 据有赞内部产品经理介绍，有赞服务的小程序商家中，绝大部分已经能被微信商品搜索抓取，但如何让商品排名更靠前，还需要等待微信的下一步动作。 四、激励消费者“推荐好物”到好物圈 好物圈是跟微信搜索紧密相连的一个功能，但相比微信搜索展示与排名存在的未知性，好物圈已经有很多的运营空间。 初期，微信好物圈的商品展现逻辑与“看一看”的资讯推荐逻辑非常相似，用户推荐已购或者收藏的商品，商品则被集中展现在“好物圈”。很快，好物圈又在“朋友推荐”基础上，新增了“创建圈组”“大家买过”两大功能。 “大家买过”是系统根据相关朋友买过的物品进行推荐，不同用户的商品界面完全不同。据不完全统计，目前“大家买过”版块推荐的小程序包括有赞商家（如roseonly、韩都严选）、环球好货、戴森官方旗舰店等。而“创建圈组”则意在将好物圈的商品进行二次细分。目前来看这一功能的使用度还较低。 [图片] 商家如何运营好物圈？ 第一个最直接的方法是：激励用户使用“推荐好物”按钮。目前，每日生鲜、有赞商家等小程序商品页面已经增加了“推荐好物”按钮，用户点击该按钮可将商品分享到好物圈，增加曝光量。因此，商家可以用过一些激励措施，提高用户使用该按钮的积极性，让优质商品在好物圈得到更多曝光。 [图片] 其次，利用好“创建圈组”，通过自建圈组或者激励用户建立圈组，形成不同属性商品的交流分享群组，增加商品曝光时间，避免因为商品流而很快被其他新商品覆盖。 五、购物直播小程序引流 视频直播在国内已经火了挺长一段时间，基于极强的场景感、互动性，直播已经成为电商商家们热衷的引流方式。微信小程序开通直播功能的时间比较晚，但庞大用户量，让商家无法忽视这一流量机会。 蘑菇街是尝试“小程序+直播”较早的平台，且成绩斐然。2018年双十一，蘑菇街小程序直播间日销售额达到平日 28.57 倍，直播小程序新客占比是 App 的 4.75 倍，有主播的直播间复购率最高超过了 90%。 2019年，“爱逛”等购物类直播小程序陆续加入战局，将让小程序的直播生态逐渐丰富起来，商家的选择也将更加多元。 [图片] （图：爱逛直播小程序） 除了上述几个渠道，其实还有很多比较重要的流量入口，例如对于门店来说非常得天独厚的小程序码引流。与此同时，微信官方还在低调尝试一些新的引流方式，例如最近被媒体曝光的“逛一逛”小程序，核心定位就是为实体零售商（包括门店和小程序）引流，不过目前仅支持少数几家零售商，未来的发展方向还有待观察。