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


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 相关文章推荐
广告切换效果(缓动切换)
May 27 Javascript
探讨JavaScript中声明全局变量三种方式的异同
Dec 03 Javascript
JavaScript在for循环中绑定事件解决事件参数不同的情况
Jan 20 Javascript
实例剖析AngularJS框架中数据的双向绑定运用
Mar 04 Javascript
基于javascript制作微信聊天面板
Aug 09 Javascript
浅谈JSON.stringify()和JOSN.parse()方法的不同
Aug 29 Javascript
jQuery编写textarea输入字数限制代码
Mar 23 jQuery
详解AngularJS2 Http服务
Jun 26 Javascript
vue--vuex详解
Apr 15 Javascript
vue项目打包后怎样优雅的解决跨域
May 26 Javascript
webpack实践之DLLPlugin 和 DLLReferencePlugin的使用教程
Jun 10 Javascript
详解Vue2的diff算法
Jan 06 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
谏山创故乡大分县日田市水坝将设立《进击的巨人》立艾伦、三笠以及阿尔敏的铜像!
2020/03/06 日漫
php代码把全角数字转为半角数字
2007/12/10 PHP
php页面缓存方法小结
2015/01/10 PHP
Java和PHP在Web开发方面对比分析
2015/03/01 PHP
php仿微信红包分配算法的实现方法
2016/05/13 PHP
PHP中echo与print区别点整理
2021/03/09 PHP
用js实现的自定义的对话框的实现代码
2010/03/21 Javascript
jQuery中parent()方法用法实例
2015/01/07 Javascript
javascript中innerText和innerHTML属性用法实例分析
2015/05/13 Javascript
javascript中alert()与console.log()的区别
2015/08/26 Javascript
基于JavaScript操作DOM常用的API小结
2015/12/01 Javascript
JS实现漂亮的时间选择框效果
2016/08/20 Javascript
JS对HTML表格进行增删改操作
2016/08/22 Javascript
jquery 动态合并单元格的实现方法
2016/08/26 Javascript
详谈DOM简介及节点、属性、查找节点的方法
2017/11/16 Javascript
Angular 组件之间的交互的示例代码
2018/03/24 Javascript
解决vue项目运行提示Warnings while compiling.警告的问题
2020/09/18 Javascript
Vue实现简单购物车功能
2020/12/13 Vue.js
Python中optparse模块使用浅析
2015/01/01 Python
python抓取网站的图片并下载到本地的方法
2018/05/22 Python
Python3+Pycharm+PyQt5环境搭建步骤图文详解
2019/05/29 Python
python实现简易学生信息管理系统
2020/04/05 Python
简单几步用纯CSS3实现3D翻转效果
2019/01/17 HTML / CSS
西班牙伏林航空公司:Vueling
2016/08/05 全球购物
英国最大的手表网站:The Watch Hut
2017/03/31 全球购物
Probikekit日本:自行车套件,跑步和铁人三项装备
2017/04/03 全球购物
先进党支部事迹材料
2014/01/13 职场文书
广告设计应届生求职信
2014/03/01 职场文书
音乐教育感言
2014/03/05 职场文书
2014年质检员工作总结
2014/11/18 职场文书
2015年党员干部承诺书
2015/01/21 职场文书
2015年学校党建工作总结
2015/05/19 职场文书
教导处教学工作总结
2015/08/12 职场文书
离婚协议书范本(2016最新版)
2016/03/18 职场文书
Python中os模块的简单使用及重命名操作
2021/04/17 Python
解析Redis Cluster原理
2021/06/21 Redis