微信小程序分享小程序码的生成（带参数）以及参数的获取

古城微笑少年丶 2023-06-10 07:26 25阅读 0赞

### 1.小程序码介绍 ###

从微信小程序开发文档上我们可以了解到，目前微信支持两种二维码（左），小程序码和小程序二维码（右）。官方推荐使用小程序码，因为小程序码具有更好的辨识度。

![format_png][]

0-1

官方提供生成小程序码的两种方式  
一种适用于需要的码的数量相对较少的业务场景：接口地址

> [https://api.weixin.qq.com/wxa/getwxacode?access\_token=ACCESS\_TOKEN][https_api.weixin.qq.com_wxa_getwxacode_access_token_ACCESS_TOKEN]

access\_token是公众号的全局唯一接口调用凭据。  
获取access\_token方法详见：[https://mp.weixin.qq.com/wiki?t=resource/res\_main&id=mp1421140183][https_mp.weixin.qq.com_wiki_t_resource_res_main_id_mp1421140183]  
具体参数见图（0-2）

![format_png 1][]

0-2

另一中适用于使用数量极多的场景。接口地址：

> [https://api.weixin.qq.com/wxa/getwxacodeunlimit?access\_token=ACCESS\_TOKEN][https_api.weixin.qq.com_wxa_getwxacodeunlimit_access_token_ACCESS_TOKEN]

具体参数见图（0-3）

![format_png 2][]

0-3

***通过scene参数来给页面添加参数***

### 2.前端请求获取小程序码具体实现 ###

因为第二中方法可生成的小程序码极多，所以我们一般会使用这种方法来获取小程序码。  
今天主要像大家介绍一下第二种方法。

一般我们主要常用的参数是：scene（如果需要页面参数）、page和width。  
page是页面地址，例如：'pages/index'。***pages前面不能有斜杠***  
scene是参数，为字符串。比如要传入一个用户id=1234，要根据这个用户id来给当前页面返回不同的内容，那么scene参数就可以写成"1234"，多个参数按一定规则分开，如&符号，第二个参数是recommendId=123则可以这样写"1234&123"。我们来开一下代码：

Page({
        data:{},
        getQrcode(){
          wx.request({
                url: "https://www....com/weixin/get-qrcode",//域名省略
                data: {
                  page:"pages/index",
                  scene:"1234&123",
                  width:300
                },
                header: {
                  'content-type': 'application/x-www-form-urlencoded'
                },
                method:  'POST',
                dataType: 'json',
                success: function(res){
                  let qrcodeUrl=res.data;//服务器小程序码地址
                },
                fail: function(){},
                complete: options.complete || function(){}
            })
        }
    })

解析：get-qrcode接口是自己小程序后端的接口，前端调用此接口，传入相应参数，后台通过参数请求小程序接口获取到小程序码存到自己服务上，返回小程序码服务器地址。

生活娱乐：[夏天到了，来喝点雪碧可乐吧☺][Link 1]

### 3.用户扫码进入后的逻辑 ###

我们可以在onload生命周期中处理参数

onLoad:function(options){
      if(options.scene){
        let scene=decodeURIComponent(options.scene);
        //&是我们定义的参数链接方式
        let userId=scene.split("&")[0];
        let recommendId=scene.split('&')[1];
        //其他逻辑处理。。。。。
      }
    }

以上就是今天分享的所有内容了，谢谢观看，喜欢可以点赞加关注哦?

### 相关推荐 ###

[微信小程序中生成二维码][Link 2]

[微信小程序生成分享海报（附带二维码生成）][Link 3]

[微信小程序生成清晰海报][Link 4]

[format_png]: /images/20230531/a4a9b420b5514139891bc5cb421d95f8.png
[https_api.weixin.qq.com_wxa_getwxacode_access_token_ACCESS_TOKEN]: https://links.jianshu.com/go?to=https%3A%2F%2Fapi.weixin.qq.com%2Fwxa%2Fgetwxacode%3Faccess_token%3DACCESS_TOKEN
[https_mp.weixin.qq.com_wiki_t_resource_res_main_id_mp1421140183]: https://links.jianshu.com/go?to=https%3A%2F%2Fmp.weixin.qq.com%2Fwiki%3Ft%3Dresource%2Fres_main%26id%3Dmp1421140183
[format_png 1]: /images/20230531/9be400cd8f7246c5a91533405cf72411.png
[https_api.weixin.qq.com_wxa_getwxacodeunlimit_access_token_ACCESS_TOKEN]: https://links.jianshu.com/go?to=https%3A%2F%2Fapi.weixin.qq.com%2Fwxa%2Fgetwxacodeunlimit%3Faccess_token%3DACCESS_TOKEN
[format_png 2]: /images/20230531/96551ca3026649fe87b33e8ce89179d8.png
[Link 1]: https://www.jianshu.com/p/e8a16eda0fd8
[Link 2]: https://www.jianshu.com/p/e6021798cd40
[Link 3]: https://www.jianshu.com/p/266545660eef
[Link 4]: https://www.jianshu.com/p/efa855a2560d