从公众号跳转至小程序页面，页面链接发生变化？原因剖析解决方案

遇到这个问题的小伙伴有必要先看下下面这篇博文：

为什么小程序内页面跳转传参时，要对参数应用encodeURIComponent编码？

还拿上篇博文中的参数为例，看下从公众号跳转至小程序页面时，接收到的参数是什么样子

小程序内跳转页面时传递url参数，值为https://mp.weixin.qq.com/s__biz=MzAwgxMw==&mid=10076&sn=466da94f#rd，对参数进行encodeURIComponent编码变为https%3A%2F%2Fmp.weixin.qq.com%2Fs%3F__biz%3DMzAwgxMw%3D%3D%26mid%3D10076%26sn%3D466da94f%23rd，所以在小程序中复制出该页面链接为为/pages/document/document?url=https%3A%2F%2Fmp.weixin.qq.com%2Fs%3F__biz%3DMzAwgxMw%3D%3D%26mid%3D10076%26sn%3D466da94f%23rd。
在公众号中做好相应的配置之后，打开小程序调试面板，从公众号中点击链接进入小程序的document页面，打印出接收到的参数为https%253A%252F%252Fmp.weixin.qq.com%252Fs%253F__biz%253DMzAwgxMw%253D%253D%2526mid%253D10076%2526sn%253D466da94f%2523rd，发现参数跟我们复制出来的页面链接中的参数不对。
对https%3A%2F%2Fmp.weixin.qq.com%2Fs%3F__biz%3DMzAwgxMw%3D%3D%26mid%3D10076%26sn%3D466da94f%23rd做encodeURI编码(或encodeURIComponent编码)，结果正好为https%253A%252F%252Fmp.weixin.qq.com%252Fs%253F__biz%253DMzAwgxMw%253D%253D%2526mid%253D10076%2526sn%253D466da94f%2523rd。据此可以推测，在从公众号跳转至小程序时，微信会再次对链接中参数做一次编码(这里的编码具体是encodeURI还是encodeURIComponent不确定，因为我们在小程序中已经做了一次encodeURIComponent编码，没有特殊字符了，此时再次编码，两种方法得到的结果是一样的)

知道了问题产生的原因所在，接下来便是应对之法

// 小程序document页面，解码函数
decode(url){let result = decodeURIComponent(url);if(/https?:\/\/.*/.test(result)){ // 进行1次解码，若是以http://或者https://开头，直接返回结果return result;}else{ // 若不是以http://或https://，说明是从公众号跳转过来的，多进行1次解码，返回结果result = decodeURIComponent(result);return result;}
}

在document页面写一个解码函数，对接收到的参数url进行解码。若是小程序内部跳转，只需解码1次便可得到正确的结果；若解码1次得不到期望的结果，说明是从公众号跳转到小程序的，微信多进行了1次加密，此时多进行1次解码，就可得到正确的结果。

从公众号跳转至小程序页面，页面链接发生变化？原因剖析解决方案相关推荐

uniapp微信公众号跳转到小程序（是点击微信页面上面的按钮/菜单跳转）
先看效果先贴代码: 1.先下载依赖 npm install jweixin-module --save 2.main.js Vue.config.ignoredElements.push('wx-o ...
在公众号中点击指定小程序并没有成功的跳转
场景:在公众号中点击指定小程序并没有成功的跳转,为什么会这样呢❓❓ 缘由:因为在跳转的时候,从公众号携带过去的 backurl返回路径携带 # 字符 ,这和小程序的hash路由模式解析发生冲突而阻断了 ...
微信公众号发送小程序卡片_微信公众号里怎么添加小程序-如何在微信[[公众号]]添加小程序卡片-微信关联小程序...
参考官方Demo 1.进入公众号,选择「关联小程序」后,微信公众号运营者用手机扫码进行认证,并输入小程序的AppID即可. 2.腾讯地图+小程序appID:wx7643d5f831302ab0 3. ...
微信公众号发送小程序卡片_如何在公众号文章中添加小程序卡片
在公众号中添加小程序卡片可以给阅读者更好的文章阅读体验,腾讯地图+小程序可以在文章内容中提供位置卡片和路线规划卡片,适用于各类含有地点信息的文章推文. 绑定腾讯地图+小程序的方法如下: 第一步:公众号 ...
微信公众号文章/菜单添加小程序时路径如何获取？
公众号文章添加素材时或者在公众号菜单可以添加小程序了:添加后用户点击可以一键跳转小程序任何界面,小程序路径获取您可以前往天天外链把路径发送给天天外链即可快速获取小程序路径. 除了公众号文章以及公众号菜 ...
公众号发送文字或者小程序
公众号发送文字或者小程序案例: <a href="http://mp.weixin.qq.com/s/YaK12221s5hBjus3i21"><Hi>& ...
c语言编程微信公众号图片直播,如何以图片的形式在微信公众号文章中添加小程序...
如何以图片的形式在微信公众号文章中添加小程序微信公众号中想要将自己的小程序也放进去,宣传宣传,该怎么添加?下面百分网小编带大家一起来看看详细操作教程,感兴趣的朋友一起学习吧!!!想了解更多相关信息请 ...
外卖优惠券返利系统外卖返利公众号搭建cps系统小程序SaaS源码
外卖优惠券返利系统外卖返利公众号搭建cps系统小程序SaaS源码美团/饿了么外卖CPS联盟返利公众号小程序裂变核心源码源代码地址 https://gitee.com/caonima008/coup ...
4大私域流量体系(个人号、公众号、社群和小程序)全方面价值对比：私域流量，企业保命之本爆发之源！...
2018年初阿里巴巴提出全新概念将流量分为公域流量和私域流量.淘内外公域流量大家都比较熟悉了包括淘宝.京东.拼多多等各大电商平台及中心化网站,这些大家共享争夺的流量就是公域流量.私域流量其实大家也早有 ...

从公众号跳转至小程序页面，页面链接发生变化？原因剖析解决方案

遇到这个问题的小伙伴有必要先看下下面这篇博文：

还拿上篇博文中的参数为例，看下从公众号跳转至小程序页面时，接收到的参数是什么样子

知道了问题产生的原因所在，接下来便是应对之法

从公众号跳转至小程序页面，页面链接发生变化？原因剖析解决方案相关推荐

最新文章

热门文章