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


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 相关文章推荐
js调用flash的效果代码
Apr 26 Javascript
prototype 中文参数乱码解决方案
Nov 09 Javascript
js控制href内容的连接内容的变化示例
Apr 30 Javascript
详解javascript中原始数据类型Null和Undefined
Dec 17 Javascript
BootStrap表单时间选择器详解
May 09 Javascript
详解Angular4中路由Router类的跳转navigate
Jun 09 Javascript
vuejs实现本地数据的筛选分页功能思路详解
Nov 15 Javascript
jQuery实现鼠标滑过商品小图片上显示对应大图片功能【测试可用】
Apr 27 jQuery
Vue封装的可编辑表格插件方法
Aug 28 Javascript
vue-cli脚手架的安装教程图解
Sep 02 Javascript
微信小程序wx:for循环的实例详解
Oct 07 Javascript
在vue中created、mounted等方法使用小结
Jul 21 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
PHP下操作Linux消息队列完成进程间通信的方法
2010/07/24 PHP
基于php 随机数的深入理解
2013/06/05 PHP
php curl模拟post请求小实例
2013/11/13 PHP
PHP使用标准库spl实现的观察者模式示例
2018/08/04 PHP
php多进程并发编程防止出现僵尸进程的方法分析
2020/02/28 PHP
JavaScript Event学习第四章 传统的事件注册模型
2010/02/07 Javascript
js 限制数字 js限制输入实现代码
2012/12/04 Javascript
js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器
2013/05/21 Javascript
jquery mobile changepage的三种传参方法介绍
2013/09/13 Javascript
浅析Cookie中的Path与domain
2013/12/18 Javascript
基于NodeJS的前后端分离的思考与实践(二)模版探索
2014/09/26 NodeJs
Javascript添加监听与删除监听用法详解
2014/12/19 Javascript
JavaScript基本语法学习教程
2016/01/14 Javascript
Vue2.x中的父子组件相互通信的实现方法
2017/05/02 Javascript
Angular2使用vscode断点调试ts文件的方法
2017/12/13 Javascript
微信小程序实现图片上传放大预览删除代码
2020/06/28 Javascript
在Echarts图中给坐标轴加一个标识线markLine
2020/07/20 Javascript
在python的类中动态添加属性与生成对象
2016/09/17 Python
python负载均衡的简单实现方法
2018/02/04 Python
django manage.py扩展自定义命令方法
2018/05/27 Python
详解python爬虫系列之初识爬虫
2019/04/06 Python
python实现Dijkstra算法的最短路径问题
2019/06/21 Python
Django中URL的参数传递的实现
2019/08/04 Python
Python异步编程之协程任务的调度操作实例分析
2020/02/01 Python
html5 touch事件实现页面上下滑动效果【附代码】
2016/03/10 HTML / CSS
Mytheresa英国官网:拥有160多个奢侈品品牌
2016/10/09 全球购物
英国袜子店:Sock Shop
2017/01/11 全球购物
美国男士西装打折店:Jos. A. Bank
2017/11/13 全球购物
朗仕(Lab series)英国官网:雅诗兰黛集团男士专属护肤品牌
2017/11/28 全球购物
测试工程师职业规划书
2014/02/06 职场文书
幼儿园爱国卫生月活动总结
2014/06/30 职场文书
简单租房协议书范本
2014/08/20 职场文书
学习焦裕禄同志为人民服务思想汇报
2014/09/10 职场文书
心得体会格式及范文
2016/01/25 职场文书
2016优秀护士先进个人事迹材料
2016/02/25 职场文书
python单向链表实例详解
2022/05/25 Python