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

 更新时间:2019年11月14日 10:25:25   作者:浅吟轻唱  
这篇文章主要介绍了微信公众号H5之微信分享常见错误和问题(小结),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

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调试技巧分享

    值得学习的JavaScript调试技巧分享

    这篇文章主要给大家介绍了一些JavaScript调试技巧,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-06-06
  • 小程序获取用户信息的两种方法详解(getUserProfile和头像昵称填写)

    小程序获取用户信息的两种方法详解(getUserProfile和头像昵称填写)

    小程序获取用户信息这部分其实不难,但是,他有点麻烦,下面这篇文章主要给大家介绍了关于小程序获取用户信息的两种方法,主要使用的是getUserProfile和头像昵称填写这两种方法,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-08-08
  • 三种带箭头提示框总结实例

    三种带箭头提示框总结实例

    这篇文章主要介绍了三种带箭头提示框总结实例 的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • 微信小程序动态显示项目倒计时效果

    微信小程序动态显示项目倒计时效果

    这篇文章主要为大家详细介绍了微信小程序动态显示项目倒计时,格式如4天7小时58分钟39秒,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • js open() 与showModalDialog()方法使用介绍

    js open() 与showModalDialog()方法使用介绍

    项目开发中经常要用到js open() 与showModalDialog()方法,下面有个不错的示例,喜欢的朋友可以研究下
    2013-09-09
  • Layui实现主窗口和Iframe层参数传递

    Layui实现主窗口和Iframe层参数传递

    今天小编就为大家分享一篇Layui实现主窗口和Iframe层参数传递,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • D3.js实现饼状图的方法详解

    D3.js实现饼状图的方法详解

    相信大家都知道图表是数据图形化的表示,通过形象的图表来展示数据,比如条形图,折线图,饼图等。可视化图表可以帮助开发者更容易理解复杂的数据,提高生产的效率和Web应用和项目的可靠性。现在就让我们大家一起来学习用D3.js来实现饼图的方法,有需要的可以参考借鉴。
    2016-09-09
  • javascript与jquery动态创建html元素示例

    javascript与jquery动态创建html元素示例

    这篇文章主要介绍了javascript与jquery动态创建html元素的方法,结合实例形式分析了javascript与jQuery动态创建页面元素的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2016-07-07
  • javascript跨域原因以及解决方案分享

    javascript跨域原因以及解决方案分享

    这篇文章主要介绍了javascript跨域原因以及解决方案分享,十分的细致全面,有需要的小伙伴可以参考下。
    2015-04-04
  • JavaScript三元运算符的多种使用技巧

    JavaScript三元运算符的多种使用技巧

    这篇文章主要介绍了JavaScript三元运算符的多种使用技巧,本文讲解了普通用法、稍微聪明点的用法、甚至更变态些的用法等,需要的朋友可以参考下
    2015-04-04

最新评论