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


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 相关文章推荐
Bookmarklet实现启动jQuery(模仿 云输入法)
Sep 15 Javascript
javascript利用初始化数据装配模版的实现代码
Nov 17 Javascript
js 模式窗口(模式对话框和非模式对话框)的使用介绍
Jul 17 Javascript
详解JavaScript中的forEach()方法的使用
Jun 08 Javascript
详细分析JavaScript变量类型
Jul 08 Javascript
jQuery实现下拉框功能实例代码
May 06 Javascript
json格式的javascript对象用法分析
Jul 04 Javascript
jQuery命名空间与闭包用法示例
Jan 12 Javascript
浅析node应用的timing-attack安全漏洞
Feb 28 Javascript
JavaScript面试出现频繁的一些易错点整理
Mar 29 Javascript
node实现登录图片验证码的示例代码
Apr 20 Javascript
vue中的数据绑定原理的实现
Jul 02 Javascript
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中的CMS的涵义
2007/03/11 PHP
PHP中浮点数计算比较及取整不准确的解决方法
2015/01/09 PHP
详谈PHP编码转换问题
2015/07/28 PHP
php读取torrent种子文件内容的方法(测试可用)
2016/05/03 PHP
全面了解PHP中的全局变量
2016/06/17 PHP
PHP 以POST方式提交XML、获取XML,解析XML详解及实例
2016/10/26 PHP
php实现银联商务公众号+服务窗支付的示例代码
2019/10/12 PHP
Javascript miscellanea -display data real time, using window.status
2007/01/09 Javascript
javascript应用:Iframe自适应其加载的内容高度
2007/04/10 Javascript
js调用百度地图及调用百度地图的搜索功能
2015/09/07 Javascript
Web前端开发工具——bower依赖包管理工具
2016/03/29 Javascript
js实现模糊匹配功能
2017/02/15 Javascript
vue项目中实现的微信分享功能示例
2019/01/21 Javascript
Layui table field初始化加载时进行隐藏的方法
2019/09/19 Javascript
vue.js实现点击图标放大离开时缩小的代码
2021/01/27 Vue.js
Python基础进阶之海量表情包多线程爬虫功能的实现
2020/12/17 Python
css3实现图片遮罩效果鼠标hover以后出现文字
2013/11/05 HTML / CSS
使用HTML和CSS实现的标签云效果(附demo)
2021/02/03 HTML / CSS
印尼太阳百货公司网站:Matahari
2018/02/04 全球购物
韩国保养品、日本药妆购物网:小三美日
2018/12/30 全球购物
英国蛋糕装饰用品一站式商店:Craft Company
2019/03/18 全球购物
GetYourGuide台湾:预订旅游活动、景点和旅游项目
2019/06/10 全球购物
施工资料员的岗位职责
2013/12/22 职场文书
幼儿园教研活动方案
2014/01/19 职场文书
区三好学生主要事迹
2014/01/30 职场文书
学生感冒英文请假条
2014/02/04 职场文书
畜牧兽医本科生的自我评价
2014/03/03 职场文书
晚自修旷课检讨书怎么写
2014/11/17 职场文书
英文慰问信
2015/02/14 职场文书
2015驻村干部工作总结
2015/04/07 职场文书
结婚典礼主持词
2015/06/29 职场文书
导游词之井冈山
2019/11/20 职场文书
python爬取豆瓣电影TOP250数据
2021/05/23 Python
教你用Java Swing实现自助取款机系统
2021/06/11 Java/Android
golang 实用库gotable的具体使用
2021/07/01 Golang
纯html+css实现打字效果
2021/08/02 HTML / CSS