如何生成自定义参数微信小程序二维码

扫码是一种常见又方便的进入移动应用的途径,可以把线上线下的用户流量带入你的移动应用中来。微信小程序也提供了扫码进入的功能,可以通过扫描二维码或者微信小程序专有的小程序码,进入到相应的小程序页面。


除了常见的小程序码之外,微信官方提供了3个不同的REST API用于生成带参数的小程序码或者二维码




调用微信公众平台的API,已经有很多成熟的开源SDK可以使用,从Github上可以搜到很多不同语言实现的SDK。由于我用的是Node.js开发,所以使用了co-wechat-api。

以下是使用co-wechat-api来获取access_token的基本用法:

const WechatAPI = require('co-wechat-api') const wxAppAPI = new WechatAPI('小程序的app id', '小程序的app secret') const token = await wxAppAPI.ensureAccessToken() console.log(token.accessToken) 


步骤2:拼接url,发送请求获取二维码图片


const fs = require('fs') const axios = require('axios') // 拼接url const url = `https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=${token.accessToken}` // 发送POST请求 const response = await axios.post(url, { page: '小程序中Page的路径', scene: '自定义参数,格式你自己决定' }, { responseType: 'stream' }) // 将请求结果中的二进制流写入到本地文件qrcode.png response.data.pipe(fs.createWriteStream('qrcode.png')) 

在上面的代码中,我们将access_token作为query string参数拼接到url上,然后向这个url发送POST请求,传递的参数主要是pagescene,其中page参数是扫码后进入的小程序页面路径(比如pages/index/index,并且不能携带参数),而scene则传入的是我们的自定义参数。

其实经过这一步,你就已经可以在你的磁盘上找到这张小程序码的图片了,用微信扫一下这张图片,就能进入你的小程序页面。


步骤3:将二维码图片输出


虽然我们已经获取到了小程序码图片,但是现在它还只是躺在我们的服务器端。而通常实际情况是,我们需要在小程序页面上去显示这张图片,让用户去保存和分享它。因此,我们需要把这张图片通过我们的API进行输出。以下是基于koa 2的示例代码:

const fs = require('fs') const Router = require('koa-router') const router = new Router()

router.get('/wx/common/qrcode', async (ctx) => { const stream = fs.createReadStream(‘qrcode.png’)
  ctx.body = stream 

})

步骤4:在小程序中显示


在小程序中显示该图片就非常简单了,直接使用组件来进行展示:

 "https://your-domain.com/wx/common/qrcode" style="width:200px;height:200px">image> 





文章出自:深圳微信开发公司,原文地址:http://www.iswweb.cn/news/1884.html,转载请保留文章出处即可!

本站文章大多数属于原创文章,欢迎大家转载!少数我们转载文章的文章,如未获您授权请点下方联系我们,我们会尽快下线处理!

相关内容