微信公众号H5之微信分享常见错误和问题(小结)


Posted in Javascript onNovember 14, 2019

url转码

官方文档描述: https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#62

确认url是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认),包括'http(s)?/'部分,以及'?'后面的GET参数部分,但不包括'#'hash后面的部分

即获取url完成地址的方法为

let url = window.location.href.split('#')[0];

如果链接带有中文字符或者特殊符号,前端需要使用encodeURIComponent编码,同时后端需要配合解码

let url = encodeURIComponent(window.location.href.split('#')[0]);

config注入

官网文档描述: https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#4

同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,
注意,每次使用jssdk方法前都要先注入配置信息,并且,每使用一次,就要注入config一次.

在vue里,可以写在每次路由变化时

router.beforeEach((to, from, next) => {
  // 获取权限验证配置(签名) 后端返回 getConfig, 注意返回字段的大小写!
  let res
  // 注入配置信息
  wx.config({
   debug: false, // 调试开关
   appId: res.appId, // 必填,公众号的唯一标识
   timestamp:res.timestamp , // 必填,生成签名的时间戳
   nonceStr: res.nonceStr, // 必填,生成签名的随机串
   signature: res.signature,// 必填,签名
   jsApiList: ["updateAppMessageShareData","updateTimelineShareData"] // 必填,需要使用的JS接口列表
  });
  wx.ready(() => {
   // doSoming
  });
})

安全域名

一定要再三确认安全域名等微信公众号配置信息,如分享链接link字段

很多时候的错误并不是前端方法或者sdk等问题,而是后台有没有设置正确的安全域名和白名单等.

wx.updateAppMessageShareData({ 
  title: '', // 分享标题
  desc: '', // 分享描述
  link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  imgUrl: '', // 分享图标
  success: function () {
   // 设置成功
  }
 })

常见错误

参考微信官网文档-附录5

地址: https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#62

在开发过程遇到

  • invalid signature
  • the permission value is offline verifying
  • permission denied

先参考文档,排除基本因素,还是不行,再查找搜索引擎的答案.

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
接收键盘指令的脚本
Jun 26 Javascript
用ASP将SQL搜索出来的内容导出为TXT的代码
Jul 27 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 Javascript
详解JavaScript对象和数组
Dec 03 Javascript
js父页面中使用子页面的方法
Jan 09 Javascript
JavaScript实现显示函数调用堆栈的方法
Apr 21 Javascript
通过jquery实现页面的动画效果(实例代码)
Sep 18 Javascript
面包屑导航详解
Dec 07 Javascript
JavaScript轮播停留效果的实现思路
May 24 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
Aug 22 Javascript
vue+高德地图实现地图搜索及点击定位操作
Sep 09 Javascript
vue项目打包后路由错误的解决方法
Apr 13 Vue.js
Jquery让form表单异步提交代码实现
Nov 14 #jQuery
vue之延时刷新实例
Nov 14 #Javascript
浅谈Vue.js之初始化el以及数据的绑定说明
Nov 14 #Javascript
vue自定义正在加载动画的例子
Nov 14 #Javascript
如何在wxml中直接写js代码(wxs)
Nov 14 #Javascript
微信小程序云开发获取文件夹下所有文件(推荐)
Nov 14 #Javascript
Vue SPA 初次进入加载动画实现代码
Nov 14 #Javascript
You might like
自定义PHP分页函数
2006/10/09 PHP
PHP 中关于ord($str)>0x80的详细说明
2012/09/23 PHP
实例分析PHP中PHPMailer发邮件
2017/12/13 PHP
php fread函数使用方法总结
2019/05/28 PHP
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
JavaScript ECMA-262-3 深入解析.第三章.this
2011/09/28 Javascript
JS小功能(onmouseover实现选择月份)实例代码
2013/11/28 Javascript
javascript对话框使用方法(警告框 javascript确认框 提示框)
2014/01/07 Javascript
使用JavaScript判断图片是否加载完成的三种实现方式
2014/05/04 Javascript
javascript获取四位数字或者字母的随机数
2015/01/09 Javascript
JavaScript返回0-1之间随机数的方法
2015/04/06 Javascript
jquery实现简单的遮罩层
2016/01/08 Javascript
Javascript中的arguments对象
2016/06/20 Javascript
JS简单实现移动端日历功能示例
2016/12/28 Javascript
webpack2.0搭建前端项目的教程详解
2017/04/05 Javascript
详解如何使用PM2将Node.js的集群变得更加容易
2017/11/15 Javascript
JavaScript设计模式之责任链模式实例分析
2019/01/16 Javascript
Tensorflow环境搭建的方法步骤
2018/02/07 Python
Python对接 xray 和微信实现自动告警
2019/09/17 Python
Python 导入文件过程图解
2019/10/15 Python
appium+python adb常用命令分享
2020/03/06 Python
树莓派4B安装Tensorflow的方法步骤
2020/07/16 Python
解决python打开https出现certificate verify failed的问题
2020/09/03 Python
python小技巧——将变量保存在本地及读取
2020/11/13 Python
python爬取微博评论的实例讲解
2021/01/15 Python
施华洛世奇韩国官网:SWAROVSKI韩国
2018/06/05 全球购物
世界顶级户外运动品牌折扣网站:LeftLane Sports
2019/06/12 全球购物
英国行业制服供应商:Alexandra
2019/09/14 全球购物
保密工作责任书
2014/04/16 职场文书
导师评语大全
2014/04/26 职场文书
公司应聘自荐书
2014/06/14 职场文书
土建专业毕业生自荐书
2014/07/04 职场文书
学习党代会心得体会
2014/09/05 职场文书
意外事故赔偿协议书
2016/03/22 职场文书
浅谈Java父子类加载顺序
2021/08/04 Java/Android
Win11开始菜单添加休眠选项
2022/04/19 数码科技