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


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代码
Mar 10 Javascript
jquery实现的一个导航滚动效果具体代码
May 27 Javascript
jQuery封装的获取Url中的Get参数示例
Nov 26 Javascript
结合代码图文讲解JavaScript中的作用域与作用域链
Jul 05 Javascript
全面解析Bootstrap表单样式的使用
Sep 09 Javascript
js在ie下打开对话窗口的方法小结
Oct 24 Javascript
JQ图片文件上传之前预览功能的简单实例(分享)
Nov 12 Javascript
关于vue的语法规则检测报错问题的解决
May 21 Javascript
解决VUE中document.body.scrollTop为0的问题
Sep 15 Javascript
记录vue做微信自定义分享的一些问题
Sep 12 Javascript
手写Vue源码之数据劫持示例详解
Jan 04 Vue.js
Vue 集成 PDF.js 实现 PDF 预览和添加水印的步骤
Jan 22 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
php $_ENV为空的原因分析
2009/06/01 PHP
php从右向左/从左向右截取字符串的实现方法
2011/11/28 PHP
常用的php图片处理类(水印、等比缩放、固定高宽)分享
2015/06/19 PHP
PHP实现求连续子数组最大和问题2种解决方法
2017/12/26 PHP
laravel框架select2多选插件初始化默认选中项操作示例
2020/02/18 PHP
DHTML 中的绝对定位
2006/11/26 Javascript
js jquery ajax的几种用法总结(及优缺点介绍)
2014/01/28 Javascript
jQuery弹出框代码封装DialogHelper
2015/01/30 Javascript
JS实现Fisheye效果动感放大菜单代码
2015/10/21 Javascript
基于jQuey实现鼠标滑过变色(整行变色)
2015/12/07 Javascript
jQuery中each()、find()和filter()等节点操作方法详解(推荐)
2016/05/25 Javascript
使用js获取地址栏参数的方法推荐(超级简单)
2016/06/14 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
2017/10/26 Javascript
jQuery.Sumoselect插件实现下拉复选框效果
2017/11/09 jQuery
Vue单页应用引用单独的样式文件的两种方式
2018/03/30 Javascript
angular6.0使用教程之父组件通过url传递id给子组件的方法
2018/06/30 Javascript
vue实现页面滚动到底部刷新
2019/08/16 Javascript
vue3 源码解读之 time slicing的使用方法
2019/10/31 Javascript
React实现类似淘宝tab居中切换效果的示例代码
2020/06/02 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
2020/07/26 Javascript
js异步接口并发数量控制的方法示例
2020/11/22 Javascript
Python程序语言快速上手教程
2012/07/18 Python
Python实现遍历目录的方法【测试可用】
2017/03/22 Python
python使用opencv读取图片的实例
2017/08/17 Python
Python用 KNN 进行验证码识别的实现方法
2018/02/06 Python
Linux下python与C++使用dlib实现人脸检测
2018/06/29 Python
Flask Web开发入门之文件上传(八)
2018/08/17 Python
解决pycharm py文件运行后停止按钮变成了灰色的问题
2018/11/29 Python
python 利用pywifi模块实现连接网络破解wifi密码实时监控网络
2019/09/16 Python
Python日志处理模块logging用法解析
2020/05/19 Python
教你使用Canvas处理图片的方法
2017/11/28 HTML / CSS
美国轮胎网站:Priority Tire
2018/11/28 全球购物
Moss Bros官网:英国排名第一的西装店
2020/02/26 全球购物
狂人日记读书笔记
2015/06/30 职场文书
详解MySQL数据库千万级数据查询和存储
2021/05/18 MySQL
Pytorch distributed 多卡并行载入模型操作
2021/06/05 Python