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


Posted in Javascript onMarch 25, 2020

1.小程序码介绍

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

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

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

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

具体参数见图(0-2)

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

另一中适用于使用数量极多的场景。接口地址:
https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN

具体参数见图(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接口是自己小程序后端的接口,前端调用此接口,传入相应参数,后台通过参数请求小程序接口获取到小程序码存到自己服务上,返回小程序码服务器地址。

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

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

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

到此这篇关于微信小程序分享小程序码的生成(带参数)以及参数的获取的文章就介绍到这了,更多相关小程序码的生成带参数内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木! 

Javascript 相关文章推荐
JavaScript监测ActiveX控件是否已经安装过的代码
Sep 02 Javascript
JavaScript中获取鼠标位置相关属性总结
Oct 11 Javascript
JavaScript不刷新实现浏览器的前进后退功能
Nov 05 Javascript
简单纯js实现点击切换TAB标签实例
Aug 23 Javascript
利用JQuery写一个简单的异步分页插件
Mar 07 Javascript
使用Script元素发送JSONP请求的方法
Jun 12 Javascript
Vue.js双向绑定操作技巧(初级入门)
Dec 27 Javascript
微信小程序三级联动地址选择器的实例代码
Jul 12 Javascript
基于vue.js中关于下拉框的值默认及绑定问题
Aug 22 Javascript
Vue触发式全局组件构建的方法
Nov 28 Javascript
Jquery使用each函数实现遍历及数组处理
Jul 14 jQuery
Vue实现鼠标经过文字显示悬浮框效果的示例代码
Oct 14 Javascript
JS实现网页时钟特效
Mar 25 #Javascript
js实现小时钟效果
Mar 25 #Javascript
vue页面更新patch的实现示例
Mar 25 #Javascript
微信小程序scroll-view隐藏滚动条的方法详解
Mar 25 #Javascript
微信小程序点击item使之滚动到屏幕中间位置
Mar 25 #Javascript
微信小程序scroll-view点击项自动居中效果的实现
Mar 25 #Javascript
微信小程序 flexbox layout快速实现基本布局的解决方案
Mar 24 #Javascript
You might like
德生PL330测评
2021/03/02 无线电
浅析PHP原理之变量(Variables inside PHP)
2013/08/09 PHP
php实现Linux服务器木马排查及加固功能
2014/12/29 PHP
PHP中的traits实现代码复用使用实例
2015/05/13 PHP
浅谈php中include文件变量作用域
2015/06/18 PHP
php利用ffmpeg提取视频中音频与视频画面的方法详解
2017/06/07 PHP
仅用[]()+!等符号就足以实现几乎任意Javascript代码
2010/03/01 Javascript
javascript 伪数组实现方法
2010/10/11 Javascript
jQuery ReferenceError: $ is not defined 错误的处理办法
2013/05/10 Javascript
Jquery和JS用外部变量获取Ajax返回的参数值的方法实例(超简单)
2013/06/17 Javascript
javascript面向对象程序设计(一)
2015/01/29 Javascript
使用window.prompt()实现弹出用户输入的对话框
2015/04/13 Javascript
javascript实现相同事件名称,不同命名空间的调用方法
2015/06/26 Javascript
jQuery往返城市和日期查询实例讲解
2015/10/09 Javascript
Bootstrap每天必学之按钮(一)
2015/11/24 Javascript
jQuery中each()、find()和filter()等节点操作方法详解(推荐)
2016/05/25 Javascript
AngularJS优雅的自定义指令
2016/07/01 Javascript
Bootstrap Table的使用总结
2016/10/08 Javascript
jQuery中的on与bind绑定事件区别实例详解
2017/02/28 Javascript
原生JavaScript实现精美的淘宝轮播图效果示例【附demo源码下载】
2017/05/27 Javascript
Angular4学习笔记之根模块与Ng模块
2017/09/09 Javascript
在移动端使用vue-router和keep-alive的方法示例
2018/12/02 Javascript
如何实现一个简易版的vuex持久化工具
2019/09/11 Javascript
vue中可编辑树状表格的实现代码
2020/10/31 Javascript
python的pandas工具包,保存.csv文件时不要表头的实例
2018/06/14 Python
nohup后台启动Python脚本,log不刷新的解决方法
2019/01/14 Python
Pandas实现dataframe和np.array的相互转换
2019/11/30 Python
Python更换pip源方法过程解析
2020/05/19 Python
意大利领先的奢侈品在线时装零售商:MCLABELS
2020/10/13 全球购物
医务人员竞聘职务自我评价分享
2013/11/08 职场文书
绩效工资分配方案
2014/01/18 职场文书
“向国旗敬礼”活动策划方案(4篇)
2014/09/27 职场文书
银行业务授权委托书
2014/10/10 职场文书
群众路线教育实践活动心得体会(教师)
2014/10/31 职场文书
婚礼迎宾词大全
2015/08/10 职场文书
2019辞职报告范本3篇!
2019/07/23 职场文书