记一次微信自定义分享debug均为true但是分享失败的经历

网上关于单页应用(vue项目)微信分享要注意的事项有很多,我就不一一列举文档里的那些了,说一些自己踩的坑,在现有资料里不容易找到的一些问题,话不多说,直接进入主题
  • 1.不带参数的页面ios可以分享成功,安卓分享始终失败,具体表现为安卓点开分享失败的链接登陆后重新分享即可成功。
       解决方法:在公众号配置的测试链接中加?,例:testxxx.com/?from=singl…
  • 2.带query参数的页面分享,安卓ios均失败,查看打开链接是因为微信加入的from参数导致的失败
       解决方法:在分享链接后面增加'?&'及可分享成功,例:link: self.link(域名) + self.share.invite_share_url(router名字) + "?&",经测试,没参数时加?,有参数时加&就行,这种方式要注意下一个页面取参数的问题。
  • 3.带query参数的页面分享,ios安卓均分享失败,而且所有debug均为true,但是两者表现不同,安卓分享出去样子上表现为分享成功,但是实际点进去不是要分享的页面,而是首页。ios表现特别明显,就是分享失败的样子,图片如下
    这个最难找,Google和baidu了一整天还是一脸懵逼,最后无意中发现是因为参数里面有汉字

解决方法:后台跳往这个页面的时候encord url里面的参数....,坑爹啊!!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在进行微信自定义分享时,需要在页面中引入微信 JS-SDK,然后通过 wx.config() 方法进行配置,最后调用 wx.onMenuShareAppMessage() 方法进行分享。 以下是一段示例代码: ``` <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> <script> wx.config({ debug: false, // 开启调试模式 appId: '你的 AppID', // 必填,公众号的唯一标识 timestamp: '时间戳', // 必填,生成签名的时间戳 nonceStr: '随机字符串', // 必填,生成签名的随机串 signature: '签名', // 必填,签名 jsApiList: [ 'onMenuShareAppMessage' // 必填,需要使用的 JS 接口列表 ] }); wx.ready(function() { // 在这里调用 wx.onMenuShareAppMessage() 方法 wx.onMenuShareAppMessage({ title: '分享标题', // 分享标题 desc: '分享描述', // 分享描述 link: '分享链接', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致 imgUrl: '分享图标', // 分享图标 success: function() { // 用户确认分享后执行的回调函数 }, cancel: function() { // 用户取消分享后执行的回调函数 } }); }); </script> ``` 在上面的代码中,wx.config() 方法用于配置 ### 回答2: 以下是一个基本的微信自定义分享的代码示例: ```javascript // 在页面加载完成后初始化微信SDK document.addEventListener("DOMContentLoaded", function() { // 引入微信JS SDK var script = document.createElement("script"); script.src = "https://res.wx.qq.com/open/js/jweixin-1.6.0.js"; script.onload = function() { // 初始化微信SDK wx.config({ appId: "YOUR_APP_ID", // 微信公众号的 app ID timestamp: "TIMESTAMP", // 该页面的生成签名的时间戳 nonceStr: "NONCESTR", // 该页面的生成签名的随机串 signature: "SIGNATURE", // 该页面的签名 jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"] // 需要使用的微信JS SDK接口 }); }; document.head.appendChild(script); }); // 微信配置成功后的操作 wx.ready(function() { // 获取当前页面的URL var url = location.href.split("#")[0]; // 自定义分享的内容 var shareData = { title: "自定义分享标题", desc: "自定义分享描述", link: url, imgUrl: "分享缩略图的URL" }; // 更新“分享给朋友”按钮及分享到朋友圈的信息 wx.updateAppMessageShareData(shareData); wx.updateTimelineShareData(shareData); }); ``` 上述代码中,需要替换的部分有: `YOUR_APP_ID`:微信公众号的 app ID,可在公众号后台获取。 `TIMESTAMP`:生成签名的时间戳,可以通过后台接口获取。 `NONCESTR`:生成签名的随机串,可以通过后台接口获取。 `SIGNATURE`:该页面的签名,可通过后台接口获取。 `标题`、`描述`、`URL`、`分享缩略图的URL`:根据实际情况自定义分享的内容。 以上代码实现了在页面加载完成后初始化微信SDK,并在微信配置成功后自定义分享的标题、描述、URL和缩略图。在用户点击“分享给朋友”或“分享到朋友圈”按钮时,会触发相应的分享操作。 ### 回答3: 下面是一个简单的使用微信自定义分享功能的代码示例: ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>微信自定义分享</title> <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> <script> wx.config({ appId: '你的App ID', timestamp: '生成签名的时间戳', nonceStr: '生成签名的随机串', signature: '签名', jsApiList: ['updateAppMessageShareData', 'updateTimelineShareData'] }); wx.ready(function () { // 自定义分享到朋友圈 wx.updateTimelineShareData({ title: '分享标题', link: '分享链接', imgUrl: '分享图标', success: function () { // 分享成功回调 alert("分享到朋友圈成功"); } }); // 自定义分享给好友 wx.updateAppMessageShareData({ title: '分享标题', desc: '分享描述', link: '分享链接', imgUrl: '分享图标', success: function () { // 分享成功回调 alert("分享给好友成功"); } }); }); </script> </head> <body> <!-- 页面内容 --> </body> </html> ``` 请确保在更新`appId`、`timestamp`、`nonceStr`和`signature`时提供正确的数值。同时,也要替换分享的标题、链接、图片等信息,以满足你自己的需求。分享成功后,你可以根据需要添加一些额外的操作或通知用户分享结果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值