当前位置: 首页 > news >正文

在小程序中打开普通二维码

  转载注明出处:www.xdxxdxxdx.com,或者加入java学习群学习讨论:481845043

 有时候我们先做好了微信站,并且印刷好了一些宣传材料,宣传材料上的二维码为原来微信站的二维码,但是我们现在要主推小程序了,所以我们希望通过这些普通的二维码也能进入小程序的页面,这时候,我们就需要学习本篇所讲的知识了。

    以下就来介绍如何通过普通二维码进入小程序页面。

一.到小程序后台配置页面路径规则

    因为普通的二维码访问的是普通的网页路径,怎么让微信识别到这是一个小程序的路径而不是普通的页面路径呢?这就需要到小程序后台去配置路径规则。举个例子来说:我用www.xdxxdxxdx.com/article/23生成了一个二维码,很显然这是一个网站的二维码,但是我想要微信扫描这个二维码的时候,跳转到小程序的page/index/index。这时候就需要配置路径规则将二者绑定起来。

    小程序后台--》设置--》开发设置--》扫普通链接二维码打开小程序,就可以添加普通链接路径与小程序路径的对应关系,如下图所示。

QQ截图20181101160200.jpg

    上述我们将www.wonyen.com/xcxxxxx这个路径规则与pages/index/index关联起来了,所以当我们扫普通码的时候,只要这个码是以www.wonyen.com/xcxxxxx这个路径开头的二维码,比如www.wonyen.com/xcxxxxx?buy=1166。微信都会引导到小程序的pages/index/index页面来,然后我们再在这个页面的js代码中去进行分发。把所有的访问都引导到首页,然后再进行分发,可以避免一些不必要的麻烦事情发生。

二.编写分发代码

    先看代码,代码如下:

const app = getApp();
const prototype = require( '../utils/prototype.js' );
const dictionaries = {
   buy:  '/pages/realCommodity/realCommodityDetail?realCommodityId=' ,
   shop:  '/pages/shop/index?merchantId=' ,
   orderList:  '/pages/orderList/orderList' ,
   realOrderId:  '/pages/orderDetial/orderDetial?realOrderId='
}
const tabPage = [ 'shoppingCart' 'orderList' 'userCenter' ]
 
const routeResult =  function  (parameter) {
   if  (parameter.q) {
     //解码并获取到参数的数组
     const pmArray = decodeURIComponent(parameter.q).replace(app.domain +  'xcxRoute?' '' ).split( '=' );
     if  (dictionaries[pmArray[0]]) {
       const result = {};
       result.url = dictionaries[pmArray[0]] + (pmArray[1] ? pmArray[1] :  '' );
       result.isTabPage = prototype.inArray(tabPage, pmArray[0]);
       return  result
     }
   }
   return  false ;
}
 
module.exports = {
   routeResult: routeResult
}

      我们将路由分发的代码写成一个模块,以供其他页面调用。我们用了数据字典将普通的二维码链接跟小程序的链接一一对应,比如buy对应的是/pages/realCommodity/realCommodityDetail?realCommodityId=。当有一个链接来的时候,我们判断其parameter.q是否存在,存在则表明是普通的二维码链接,我们需要根据数据字典找出其实际的小程序路径,并且判断其是否是tab页。并存入到返回值中。

三.调用

在index.js里面,我们先引入上述模块,然后在页面加载的时候判断链接是否是普通链接,若普通链接则调用上述模块来进行分发。

const routeDictionary = require(app.resource.util.routeDictionary);
const routeUrl = routeDictionary.routeResult(options);
  //如果是通过扫普通二维码过来的,在这里进行分发转跳
     if  (routeUrl) {
       if  (routeUrl.isTabPage) {
         wx.switchTab({
           url: routeUrl.url,
         })
       else  {
         wx.navigateTo({
           url: routeUrl.url,
         })
       }
     }

转载于:https://www.cnblogs.com/roy-blog/p/9963072.html

相关文章:

  • 网站资源【珍藏版】
  • 四则运算
  • 131-三元运算符
  • JDK、Tomcat、Eclipse安装和配置。。。
  • Pyhon 中文编码问题(字符串前加‘U’)
  • java数据结构基本框架
  • linux_用户以及权限
  • webpack4配置详解之新手上路初探
  • ConnectionState详解
  • Oracle EBS 获取用户挂的职责 请求 请求的类别(RTF还是什么的)
  • bzoj 2655 calc——拉格朗日插值
  • 关于mysql数据库的乱码问题
  • n阶行列式算法(c程序)
  • 2-2+CPU多级缓存-乱序执行优化
  • 正则表达式中/i,/g,/ig,/gi,/m的区别和含义
  • JavaScript 如何正确处理 Unicode 编码问题!
  • 【vuex入门系列02】mutation接收单个参数和多个参数
  • ABAP的include关键字,Java的import, C的include和C4C ABSL 的import比较
  • canvas 五子棋游戏
  • eclipse(luna)创建web工程
  • IOS评论框不贴底(ios12新bug)
  • JS进阶 - JS 、JS-Web-API与DOM、BOM
  • js写一个简单的选项卡
  • js作用域和this的理解
  • MySQL数据库运维之数据恢复
  • SegmentFault 社区上线小程序开发频道,助力小程序开发者生态
  • Spark RDD学习: aggregate函数
  • Vue源码解析(二)Vue的双向绑定讲解及实现
  • 产品三维模型在线预览
  • 从setTimeout-setInterval看JS线程
  • 道格拉斯-普克 抽稀算法 附javascript实现
  • 码农张的Bug人生 - 见面之礼
  • 买一台 iPhone X,还是创建一家未来的独角兽?
  • 七牛云假注销小指南
  • 前端代码风格自动化系列(二)之Commitlint
  • 浅谈Kotlin实战篇之自定义View图片圆角简单应用(一)
  • 手写双向链表LinkedList的几个常用功能
  • 数组的操作
  • python最赚钱的4个方向,你最心动的是哪个?
  • 翻译 | The Principles of OOD 面向对象设计原则
  • 函数计算新功能-----支持C#函数
  • ​html.parser --- 简单的 HTML 和 XHTML 解析器​
  • # Maven错误Error executing Maven
  • #预处理和函数的对比以及条件编译
  • (31)对象的克隆
  • (LeetCode) T14. Longest Common Prefix
  • (附源码)spring boot公选课在线选课系统 毕业设计 142011
  • (附源码)计算机毕业设计SSM保险客户管理系统
  • (原創) 如何優化ThinkPad X61開機速度? (NB) (ThinkPad) (X61) (OS) (Windows)
  • .NET Core 2.1路线图
  • .NET 编写一个可以异步等待循环中任何一个部分的 Awaiter
  • .net6Api后台+uniapp导出Excel
  • .NET和.COM和.CN域名区别
  • .net通用权限框架B/S (三)--MODEL层(2)
  • .net图片验证码生成、点击刷新及验证输入是否正确