一、场景需求: 在小程序个人名片页面A页面,生成用户的个人名片二维码(该二维码携带用户的唯一标识id);微信扫一扫或长按图片识别这个二维码,可以跳转到小程序的B页面,并且在B页面拿到二维码上的唯一标识id;
大致要求就是:小程序生成的这个二维码,可以识别跳转到小程序某页,且会携带某些自定义参数,在被跳转页面还可以拿到这些自定义参数。

//我的是在个人名片页生成二维码,识别二维码跳转到首页pages/tabBar/home/index 携带参数 user_code
path: `pages/tabBar/home/index?user_code=${this.myObj.user_code}`

二、生成二维码,必须后端生成!(如果前端生成,总是会报access_token过期,导致获取二维码失败;而且前端获取需要把秘钥AppSecret写在前端,不安全;)
后端生成二维码点击此篇查看:Java 生成微信小程序二维码(可以指定小程序页面 与 动态参数)
以及 腾讯小程序官方生成动态参数二维码方法
注意点:(尤其第四点)
–1.后端生成二维码,然后前端只需要调用后端接口,传递跳转路径和自定义参数即可;
.
–2.后端生成二维码,需要用到秘钥AppSecret;此时秘钥就只能给后端用,前端代码千万不要也用到秘钥;否则也会导致access_token过期等问题;
.
–3.还是access_token问题,因为本地测试环境和生产环境生成二维码都是后端接口给的;而后端又都用到了秘钥AppSecret;就会导致测试环境和正式环境 access_token冲突问题,也就是你在测试环境本地获取了二维码,可能导致线上生产环境的获取二维码报access_token问题获取失败;
解决办法:测试环境和线上生产环境使用同一个缓存内的access_token,如果某个环境获取新的了,那另一个环境也用新的access_token即可!
.
–4.后端生成的二维码,无论是 本地测试环境生成的、小程序工具生成的、真机调试生成的、或者线上生产环境生成的二维码,你识别后它都是跳到线上生成环境地址! 也就是说这个二维码就是只能跳到线上生产环境的小程序指定页面,那么就导致前端本地开发小程序时候,不太好测试这个识别二维码跳转小程序携带参数的功能(但也有办法测试):
首先我们要知道,这个识别二维码并携带参数跳转小程序页面 B,会触发指定跳转B页面的onLoad函数,那么我们就需要在指定B页面的onLoad函数内拿到这个自定义参数:

// 指定二维码跳转的页面   ---------跳转页获取二维码自定义参数---------
onLoad: (opts) {console.log('首页onLoad', opts )// 直接获取二维码自定义参数if (opts.user_code) {this.far_usercode = opts.user_code}
}

接上面4.说:如何在开发时候,解决识别二维码跳线上上产环境的小程序页面,导致的开发时候不好测试问题:
.
4.1方案1:小程序工具测试 :把二维码图片保存到桌面,通过小程序工具–普通编译–添加编译模式–上传文件(二维码图片)–会自动识别跳转路径和自定义参数–点击确定。即可在小程序工具上看到 跳转到 指定页面且onLoad也可以拿到参数;


4.2方案2:小程序工具测试: 和上述方法类似但更简单;小程序工具–普通编译–通过二维码编译–上传二维码图片;

4.3方案3:真机扫码预览测试或者真机调试。(这一步略微麻烦但可以达到真机测试:因为我们知道小程序页面分享也是会触发到分享跳转页的onLoad函数,和二维码跳转一样逻辑;那么我们就可以在个人名片页A,也就是获取到二维码的那个页面,写一个分享功能,点击分享按钮,将此页面分享给微信好友,微信好友点击跳转的时候,携带自定义参数跳到我们想要二维码跳转的指定页面B;以此模拟二维码识别)
.
分享功能就两步骤(这两步代码都是写在获取到二维码的那个页面A)
步骤1:html里的分享按钮 <button open-type="share">分享到微信</button>
步骤2:在js里写上和onLoad函数同级别的分享函数:既下方的onShareAppMessage函数
步骤3:你分享给好友后,微信好友点击这个分享就会跳转到指定页面B,也可以在onLoad拿到自定义参数
–只要你这个分享功能没问题 那你线上生产环境的 二维码识别跳转携带参数功能一定没问题

  // 个人名片页 分享函数onShareAppMessage (res) {if (res.from === 'button') {// 来自页面内分享按钮console.log(res.target)}return {title: '诚邀您使用保客多多,开启客户管理轻松之旅!',//这里就是你要微信用户打开你的分享后跳转的页面路径和参数  //你会发现这个路径及参数 和后端要求你获取二维码接口 传递的路径及参数 是一样的  (也可能 后端接口会让你多传上路径开头的 / )path: `pages/tabBar/home/index?user_code=${this.myObj.user_code}`}},onLoad(){},

4.4方案4:当你的线上生产环境已经发布过小程序,且也有onLoad处理逻辑,那么你就直接真机识别二维码,直接跳到生产环境看即可(但是往往开发时候,我们的线上生产环境逻辑都没写对吧);
.
还有一种方案,就是uni-app发行微信小程序,会在小程序工具内调用线上生产环境的接口,自动编译成线上版本的,然后你手机微信预览扫码,真机上也就是使用线上生产环境版本;这个时候如果你识别二维码图片,跳转打开的是小程序是刚才你预览二维码的那个线上小程序还是真正的线上生产环境的小程序页面,这个我没有测试过,感觉可以试试!

小程序生成的动态参数二维码 小概率未携带参数(官方bug)

微信小程序生成二维码,坑比较多,但是按照上述步骤和4.1-4.3测试方案来,一定可以解决!

uni-app微信小程序生成自定义参数二维码,跳转小程序指定页面,获取参数;uni-app微信小程序获取二维码自定义参数;微信小程序生成动态参数二维码;uni-app微信小程序获取动态参数二维码;相关推荐

  1. 扫码普通二维码跳转微信小程序指定页面(体验服和开发服跳转链接不能动态传参)

    好久不见,时隔多年我又来记录问题来了,记录这次问题的主要原因是减少你我去搜索资源的时间,下面开始讲讲我越到的问题.(下面说的是针对小程序体验版或者开发版哈,正式环境不存在这个问题) 需求:pc端扫码登 ...

  2. 微信小程序扫描普通二维码跳转到小程序指定页面

    这个功能的逻辑是什么呢? 二维码就相当于是一个链接 相当于我们点击一个链接跳转到另一个页面 只不过这里是扫码的形式 如何操作 1.首先我们需要在微信公众平台的开发管理-->开发设置,找到(扫普通 ...

  3. 微信扫一扫扫描二维码跳转到小程序指定页面

    转载:微信扫一扫扫描二维码跳转到小程序指定页面 1微信公众平台-开发-开发设置-扫普通链接二维码打开小程序 2点击添加 3设置二维码规则,选择测试范围 4 保存后,可根据测试连接生成二维码,通过微信扫 ...

  4. 分享!如何分分钟实现微信扫二维码调用外部浏览器打开指定页面的功能

    需求分析 现在微信分享二维码进行推广的方式已经成为大家常用且便捷的方法了.但是经常会有分享出去的链接或二维码都无法正常打开指定页面,提示"已停止访问网页",故导致无法下载app. ...

  5. 微信扫码---进入小程序指定页面(传参)

    使用场景: 商场的游戏机,用微信扫码获取机器id,进入到小程序指定页面,进行下单购买. 微信公众平台中 开发--开发设置--扫普通链接二维码打开小程序中配置的二维码有数量限制,不能满足多台机器的需要. ...

  6. 实现微信扫一扫跳转到小程序指定页面

    使用微信扫一扫进入小程序内的指定页面 文章目录 使用微信扫一扫进入小程序内的指定页面 前言 一.微信小程序平台配置 二.前端uniapp中的获取二维码信息 三.后端处理参数 总结 前言 使用场景:例如 ...

  7. 利用微信开发者工具获取小程序指定页面路径!

    利用微信开发者工具获取小程序指定页面路径! 小程序不同于app,小程序的每个页面都有页面路径.在使用微信小程序的过程中,很多场景都要使用到小程序的页面路径.比如微信图文中的小程序,公众号菜单中的小程序 ...

  8. 在线制作微信跳转链接源码可以实现微信跳转浏览器打开指定页面的功能

    源码使用场景: 1.用来实现微信自动跳转外部浏览器下载app 2.用来实现微信内打开网页链接自动跳转浏览器访问指定页面 3.防止网页链接由于被微信拦截,导致用户无法正常在微信内打开 源码说明: 适用安 ...

  9. 微信模板消息跳转小程序指定页面(非首页)的问题

    需求 微信公众号发送模板消息,跳转到指定小程序的页面,可携带参数 问题点 文档 示例 根据官方文档的描述和示例展示,模板消息对象只要在miniprogram 对象中设置小程序的appid 和 page ...

最新文章

  1. Git Push 避免用户名和密码方法
  2. codeforces C Deletion of Repeats(hash)
  3. Fiddler抓取移动端请求
  4. bootstrap样式代码案例
  5. Windows安装Redis(转!)
  6. 创业奇才:才3年5000元变600万
  7. 加快战略转型进程:统帅电器挺进年轻用户市场
  8. matlab 修正后阿尔法,修正后的阿尔法均值滤波器Alpha.ppt
  9. excel 科学计数法转换成文本完整显示_Excel中的数字格式和文本格式转换
  10. 通过网易云歌单链接下载网易云歌曲
  11. 用74ls90组成二十四进制计数器_六十进制应该怎么怎么设计呢?
  12. dxf解析python_Python 读取DXF文件
  13. 原生js生成气泡碰撞,随机生成颜色
  14. 尝试手写一个框架(二)手写一个MVC的框架
  15. win10下出现.net framework 3.5错误代码0x800F081F的问题
  16. 联想拯救者19款原厂系统镜像
  17. C语言知识-关键字stastic
  18. Android中获取手机内所有应用信息
  19. 管理:身先士卒是必要的手段
  20. linux设置定时任务(crontab)

热门文章

  1. 网络的体系结构与协议分层
  2. Java父亲节贺卡,父亲节贺卡内容怎么写?
  3. Nginx:2、https 已阻止混合内容
  4. 1904年 圣路易斯 第三届奥运会
  5. 地图标注可编辑 - 案例:全国各省家庭住房月总支出地图
  6. 业界信息系统集成的三个主流模式:单点登录、数据融合、过程协同
  7. 杨澜经典语录:与思想交朋友。
  8. Android感应检测Sensor(简单介绍),Android架构师之路
  9. 理发师问题PV操作实现(Java)
  10. 计算机无法识别鼠标怎么设置,win10电脑不识别鼠标怎么处理