小程序扫描普通链接二维码跳转小程序指定界面方法


Posted in Javascript onMay 07, 2019

微信官方文档https://developers.weixin.qq.com/miniprogram/introduction/qrcode.html

看了官方文档之后,还是存在很多困惑,微信小程序是托管到微信服务器上的,要想扫描普通链接跳转指定界面,首先要知道微信把小程序放的服务器的访问路径,这些最初想法,可是看微信官方文档,感觉不是我想的这样的

小程序扫描普通链接二维码跳转小程序指定界面方法

文档上:“二维码规则的域名须通过ICP备案的验证。”如果是微信的服务器,那他们就不必这么写了,

可是小程序是托管微信服务器上的,为什么扫码自己服务器上的url能跳转呢?困惑反倒是多了,然后各种查资料,最后还是在微信官方文档上找到答案了

 小程序扫描普通链接二维码跳转小程序指定界面方法

原来是这样!恍然大悟!微信会扫描所有自己配置的url,如果匹配上了,就跳转至指定界面,还有个前提,小程序必须先发布代码,才可以。

小程序扫描普通链接二维码跳转小程序指定界面方法

 下面记录一下详情:

1.二维码规则,这里需要下载微信提供的验证文件,放到指定目录,验证不过会有提示,验证过了如图所示,配置几层目录根据自己的需求而定,上图这个:https://www.aaa.com/a/b/c/ 验证文件放置到c目录同层

2.测试链接,这里的url就是扫码之后,跳转到你指定界面里,可以获取到你此处配置这个完整的url包括参数,当然,这个参数是一个动态参数,配置的时候是写死了一个,你的应用中,自己动态生成这个参数,
https://www.aaa.com/a/b/c/d/service?flag=123 目录a/b/c/d/是在你的服务器上真实存在的目录,在d目录里面有个脚本service,当然目录名称脚本名称换成你自己的,flag这个key值不能改变,123换成你的实际生成的动态参数

3.在app.js中这样获取参数
util.js
/**
* 获取url参数
*/

let getQueryString = function (url,name) {
 console.log("url = "+url)
 console.log("name = " + name)
 var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
 var r = url.substr(1).match(reg) 
 if (r != null) {
  console.log("r = " + r)
  console.log("r[2] = " + r[2])
  return r[2]
 }
 return null;
}
module.exports = {
 getQueryString: getQueryString,
}

//app.js文件如下:

var utils = require('./utils/util')

App({
 onLaunch: function (options) {
  console.log("全局onLaunch options==" + JSON.stringify(options))
  let q = decodeURIComponent(options.query.q)
  if (q){
   console.log("全局onLaunch onload url=" + q)
   console.log("全局onLaunch onload 参数 flag=" + utils.getQueryString(q, 'flag'))
  }

 }

})

在其它的界面中的js脚本中这样获取参数

Page({

 /**
  * 页面的初始数据
  */
 data: {

 },

 /**
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  console.log("index 生命周期 onload"+JSON.stringify(options))
  //在此函数中获取扫描普通链接二维码参数
  let q = decodeURIComponent(options.q)
  if(q){
   console.log("index 生命周期 onload url=" + q)
   console.log("index 生命周期 onload 参数 flag=" + utils.getQueryString(q, 'flag'))
  }
 }

})

以上所述是小编给大家介绍的小程序扫描普通链接二维码跳转小程序指定界面详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JS效率个人经验谈(8-15更新),加入range技巧
Jan 09 Javascript
js 实现无缝滚动 兼容IE和FF
Jul 15 Javascript
Jquery 点击按钮显示和隐藏层的代码
Jul 25 Javascript
Extjs优化(二)Form表单提交通用实现
Apr 15 Javascript
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
Apr 27 Javascript
完善的jquery处理机制
Feb 21 Javascript
关于页面刷新vuex数据消失问题解决方案
Jul 03 Javascript
Vue.js实现列表清单的操作方法
Nov 15 Javascript
vue+element 模态框表格形式的可编辑表单实现
Jun 07 Javascript
解决layui弹出层layer的area过大被遮挡的问题
Sep 21 Javascript
详解vue中v-bind:style效果的自定义指令
Jan 21 Javascript
如何在vue-cli中使用css-loader实现css module
Jan 07 Vue.js
VUE接入腾讯验证码功能(滑块验证)备忘
May 07 #Javascript
vue接入腾讯防水墙代码
May 07 #Javascript
基于Vue实现的多条件筛选功能的详解(类似京东和淘宝功能)
May 07 #Javascript
详解vue中使用protobuf踩坑记
May 07 #Javascript
Node.js一行代码实现静态文件服务器的方法步骤
May 07 #Javascript
微信小程序扫描二维码获取信息实例详解
May 07 #Javascript
Vue数据绑定简析小结
May 07 #Javascript
You might like
基于empty函数的判断详解
2013/06/17 PHP
Linux操作系统安装LAMP环境
2015/06/26 PHP
PHP将二维数组某一个字段相同的数组合并起来的方法
2016/02/26 PHP
PHP实现的折半查询算法示例
2017/10/09 PHP
Laravel框架生命周期与原理分析
2018/06/12 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
Javascript 更新 JavaScript 数组的 uniq 方法
2008/01/23 Javascript
JS解决url传值出现中文乱码的另类办法
2013/04/08 Javascript
javascript实现回到顶部特效
2015/05/06 Javascript
javascript封装 Cookie 应用接口
2015/08/07 Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
2015/08/10 Javascript
javascript运动效果实例总结(放大缩小、滑动淡入、滚动)
2016/01/08 Javascript
JavaScript实现Base64编码转换
2016/04/23 Javascript
javascript加载xml 并解析各节点的值(实现方法)
2016/10/12 Javascript
原生Javascript插件开发实践
2017/01/09 Javascript
搭建vue开发环境
2018/07/19 Javascript
解决layui的radio属性或别的属性没显示出来的问题
2019/09/26 Javascript
JS实现水平移动与垂直移动动画
2019/12/19 Javascript
python生成指定尺寸缩略图的示例
2014/05/07 Python
python常见数制转换实例分析
2015/05/09 Python
深入解析Python中的集合类型操作符
2015/08/19 Python
Python中单例模式总结
2018/02/20 Python
Flask框架Flask-Login用法分析
2018/07/23 Python
Python综合应用名片管理系统案例详解
2020/01/03 Python
用Python做一个久坐提醒小助手的示例代码
2020/02/10 Python
python实现FTP文件传输的方法(服务器端和客户端)
2020/03/20 Python
python读取图片颜色值并生成excel像素画的方法实例
2021/02/19 Python
HEMA法国:荷兰原创设计
2019/02/21 全球购物
Myprotein荷兰官网:欧洲第一运动营养品牌
2020/07/11 全球购物
纬创Java面试题笔试题
2014/10/02 面试题
OLEDBConnection和SQLConnection有什么区别
2013/05/31 面试题
大学生护理专业自荐信
2013/10/03 职场文书
节能环保标语
2014/06/12 职场文书
学校领导班子对照检查材料
2014/08/28 职场文书
个人查摆问题自查报告
2014/10/16 职场文书
深入解析Apache Hudi内核文件标记机制
2022/03/31 Servers