获取小程序指定页面的小程序码
小程序二維碼生成官方文檔鏈接 https://mp.weixin.qq.com/debug/wxadoc/dev/api/qrcode.html
如果你有一個頁面，比如某個商品詳情頁： /Page/detail/detail?id=1000000，你希望生成這個頁面的一個小程序碼；那么你就需要調用小程序的接口來生成這個二維碼了；
具體思路：
1.按照官方文檔的指示，首先你要調接口獲取你的AccessToken才能使用生成小程序碼的接口；
2.得到AccessToken后就可以開始調用生成小程序碼的B接口了，一般來說，要傳兩個參數：page參數是你的頁面鏈接，scene參數就是你要傳給頁面的參數，例如上面的id=1000000中的1000000
3.得到微信返回的小程序碼后，將圖片保存到你的后臺服務器，然后把圖片的路徑返回到前端；
4.前端得到了圖片的鏈接后，就可以直接渲染在頁面上了；
小程序提供了三個接口可以生成指定的頁面的二維碼，分別為A接口，B接口，C接口；
A接口和C接口都有數量限制：10萬個；而且C接口只能請求到普通的方形二維碼；
所以我選擇了B接口；
獲取小程序碼的后臺代碼封裝在utils/creatQrCode.js中，代碼如下：
1 var fs = require('fs');
2 var request = require('request');
3
4 var AccessToken = {
5 grant_type: 'client_credential', //這里填這個值就可以了
6 appid: 'vvvvvvvvvvvvvvvvv', //你的小程序appid
7 secret: 'vvvvvvvvvvvvvvvvv' //你的小程序secret
8 }
9
10 //獲取你的AccessToken的鏈接
11 var wx_gettoken_url = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=' + AccessToken.grant_type + '&appid=' + AccessToken.appid + '&secret=' + AccessToken.secret;
12
13
14
15 var create_time = 0,
16 now = 0,
17 token = '';
18 var createQrcode = {
19 test:function(){
20 console.log('test')
21 },
22 create: function(config) {
23 var that = this;
24 return new Promise(function(resolve, reject) {
25 console.log('fn：create');
26 if (that.isInTwoHours()) {
27 that.getQrcode(config).then((res)=>{
28 resolve(res)
29 });
30
31 } else {
32 getWxToken().then(res => {
33 if (res.isSuccess) {
34 that.getQrcode(config).then((res)=>{
35 resolve(res)
36 });
37
38 } else {
39 console.log('獲取token出錯');
40 }
41 })
42 }
43 })
44 },
45 //判斷是否超過兩個小時，將token存儲起來，減少token請求。
46 isInTwoHours: function() {
47 console.log('fn:isTwoHours');
48 now = new Date().getTime();
49 var diffHours = (now - create_time) / (60 * 1000);
50 console.log('diffHours：' + diffHours);
51 if (diffHours < 2) {
52 return true;
53 } else {
54 return false;
55 }
56 },
57
58 getQrcode:function(config){
59 return new Promise(function(resolve, reject) {
60 resolve(
61 request({
62 method: 'POST',
63 url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=' + token.access_token,
64 body: JSON.stringify({
65 path:config.path,
66 scene:config.scene
67 })
68 })
69 )
70 }).then(data => {
71 data.pipe(fs.createWriteStream('../upload/qrcode/' + config.scene + '.png'))
72 return new Promise(function(resolve, reject) {
73 resolve('https://VV.VVVVV.com/images/qrcode/' + config.scene + '.png') //將圖片完整的鏈接返回出去
74 })
75 })
76 }
77
78
79 //獲取微信的Access-token
80 var getWxToken = function() {
81 console.log('fn:getWxToken');
82 var that = this;
83 return new Promise((resolve, reject) => {
84 request({
85 method: 'GET',
86 url: wx_gettoken_url
87 }, function(err, res, body) {
88 if (res) {
89 create_time = new Date().getTime();
90 token = JSON.parse(body);
91 console.log(token,2222222222)
92 resolve({
93 isSuccess: true
94 });
95 } else {
96 console.log(err);
97 resolve({
98 isSuccess: false
99 });
100 }
101 }
102 )
103 });
104 }
105
106 module.exports = createQrcode;
View Code
然后在express的路由中調用生成小程序碼的方法：
var creatQrcode = require('../utils/creatQrCode');
router.post("/createQrcode",function(req, res, next){
let pageSrc = req.body.pageSrc; //頁面鏈接
let scene = req.body.scene; //頁面參數
let config={page:pageSrc,scene:scene}
creatQrcode.create(config).then((imgUrl)=>{ //請求到小程序碼后得到圖片鏈接
res.json({
status:0,
imgUrl:imgUrl //將圖片鏈接返回給前端
})
})
})
最后，你要在該小程序頁面上做處理，具體思路：
1.如果用戶是掃你的小程序碼進這個頁面的，那么就會有一個scene；
2.如果用戶是點擊其他頁面條狀進來的，那么鏈接類似這樣的：/Page/detail/detail?id=1000000，你要處理的只是id；
具體代碼如下：
........
onLoad:function(options){
if (options.scene) { //如果是掃碼進來這個頁面的話
var scene = decodeURIComponent(options.scene);
this.setData({
id: scene
})
this.getGoodslist('shopId', scene)
} else { //如果是正常跳轉進來的話
var id = options.id;
this.setData({
id: id
})
this.getGoodslist('shopId', id)
}
},
.................
最后，如果你的小程序還沒發布，那么掃碼后是打不開指定頁面的，所以在開發階段，你可以使用微信開發工具提供的模擬掃碼進入頁面，這樣就可以調試了：
注：express獲取小程序碼圖片的代碼參考自：https://blog.csdn.net/u014477038/article/details/70056171
總結
以上是生活随笔為你收集整理的获取小程序指定页面的小程序码的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Bluetooth GATT介绍
- 下一篇： excel电子表格有哪些技巧 excel