微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解

最近开发一个项目时，有微信H5网页自定义分享功能，使用了微信JS-SDK的分享到好友和分享到朋友圈功能。

微信开发文档这样写的

自定义“分享给朋友”及“分享到QQ”按钮的分享内容（1.4.0）

wx.ready(function () {  //需在用户可能点击分享按钮前就先调用
wx.updateAppMessageShareData({
title: '', // 分享标题
desc: '', // 分享描述
link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
success: function () {
// 设置成功
}
});

自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容（1.4.0）

wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
wx.updateTimelineShareData({
title: '', // 分享标题
link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
success: function () {
// 设置成功
}
});

看起来很简单，直接加入到H5网页里面了

wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '', // 必填，公众号的唯一标识
timestamp: , // 必填，生成签名的时间戳
nonceStr: '', // 必填，生成签名的随机串
signature: '',// 必填，签名
jsApiList: [
'updateAppMessageShareData',
'updateTimelineShareData'
] // 必填，需要使用的JS接口列表
});

其他参数参考根据自己情况填写，并设置debug: true

测试环境：

微信Web开发者工具，测试接口，ok

苹果X，查看debug的弹出信息，一切ok；

分享测试，一切ok

大工搞成。咦，等下，好像漏了什么。。。。。。安卓呢？

结果果然漏了，安卓测试分享朋友圈和发送给好友，自定义分享功能都无效，仅仅分享为一个链接而已。

这个问题苹果手机好的，安卓不行，并且微信web开发者工具测试接口都是好的，那问题应该不是接口调用（后台数据都是一样的），应该是和客户端有关，但又找不到相关资料。

百思不得其姐，困惑了好久，各种度娘也没有找到正确答案。某天突发奇想，新的接口不行，那旧的接口呢？

于是乎测试开始：

加入两个旧分享接口onMenuShareAppMessage和onMenuShareTimeline，然后写了个测试方法

jsApiList: [
  'updateAppMessageShareData',
  'updateTimelineShareData',
  'onMenuShareAppMessage', //旧的接口，即将废弃
  'onMenuShareTimeline' //旧的接口，即将废弃
]// 必填，需要使用的JS接口列表

获取“分享给朋友”按钮点击状态及自定义分享内容接口（即将废弃）

wx.onMenuShareAppMessage({
title: 'test', // 分享标题
desc: 'test_desc', // 分享描述
link: 'www.jianshu.com', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
type: '', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户点击了分享后执行的回调函数
}
});

然后随便写了个测试发现居然成!功!了! 不过自定义分享内容还是新接口updateAppMessageShareData定义的。

删除旧接口定义再测试，发现仅仅在jsApiList加入旧接口声明也是可以的！

问题解决，这个真的是JS-SDK的一个坑。这篇文章希望能帮助到遇到相似问题的同学。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • thinkphp项目如何自定义微信分享描述内容

    thinkphp项目如何自定义微信分享描述内容

    本文主要讲述:在thinkphp框架中,如何获取微信分享接口权限.如何设置安全域名.如何修改微信分享标题.修改微信分享描述.修改微信分享图片.如何定制微信分享内容. 修改后的示例:http://games.zixuephp.cn 下面是修改微信分享标题.微信分享描述.微信分享图片和不修改的效果对比图: 没有修改的微信分享效果图:其中分享内容是分享的页面的url路径. 修改过微信分享内容的效果如下图:分享内容为自己定制的内容. 1.必要条件:认证过的公众号. 2.在微信公众号管理后台中,点击公众号

  • 微信自定义分享链接信息（标题，图片和内容）实现过程详解

    微信自定义分享链接信息（标题，图片和内容）实现过程详解

    网页分享到微信要怎么才能自定义标题,内容和图片呢? 需求概述 微信中可以直接转发网页链接,用户在微信内置浏览器中打开后可以通过微信浏览器中右上角进行分享到朋友,朋友圈,QQ等.但直接这样分享的话,用户看到的只是一条链接,没有任何的图文内容. 如下图,图1是别人分享给我的链接效果,图2是我分享给别人的效果.两种方案的用户体验我想都不用我多说了,一眼就能看的出来. 方案实现 要达到上图自定义文案与图标的效果,必须要采用微信提供的JS-SDK,微信JS-SDK是微信公众平台面向网页开发者提供的基于微信

  • 使用微信SDK自定义分享的方法

    一.背景介绍 在微信中打开自己网站的链接,经常会变成下面这样 不太好看有木有,如果你想在分享出来的东西带上你的logo,带上你想要的描述,怎么办,像下面这样 这就需要用到微信的分享SDK,文档链接:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html 二.微信SDK使用说明第一步 第一步 先要在微信公众平台上注册一个微信公众号,还必须要是认证的企业或组织,流程走下来大概要个两三天的时间吧,只有认证了的公众

  • thinkphp5框架结合mysql实现微信登录和自定义分享链接与图文功能示例

    本文实例讲述了thinkphp5框架结合mysql实现微信登录和自定义分享链接与图文功能.分享给大家供大家参考,具体如下: php代码 function curlHtml($url){ $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CU

  • 微信JS-SDK自定义分享功能实例详解【分享给朋友/分享到朋友圈】

    微信JS-SDK自定义分享功能实例详解【分享给朋友/分享到朋友圈】

    本文实例讲述了微信JS-SDK自定义分享功能.分享给大家供大家参考,具体如下: 分享出去的内容,可以通过jssdk进行修改. 1.配置jssdk Wx_config.html <?php import("@.ORG.jssdk"); $jssdk = new JSSDK(C('oauth_config.appid'), C('oauth_config.appsecret')); $signPackage = $jssdk->GetSignPackage(); ?> &

  • php版微信公众号自定义分享内容实现方法

    本文实例讲述了php版微信公众号自定义分享内容实现方法.分享给大家供大家参考,具体如下: 微信公众号号在手机中通过api接口可以实现自定义分享内容了,下面我们来看这个接口的实现步骤. 一.准备阶段 公众号一个,微网站一个. 二.绑定域名 先登录微信公众平台进入"公众号设置"的"功能设置"里填写"JS接口安全域名". 备注:登录后可在"开发者中心"查看对应的接口权限. 三.代码 <?php //curl获取请求文本内容 f

  • 微信小程序前端自定义分享的实现方法

    微信小程序前端自定义分享的实现方法

    背景 目前手上有一个小程序的项目,希望转发时分享消息的界面能够自定义,然而微信小程序只提供设置图片的url和title. /** * 用户点击右上角分享 */ onShareAppMessage: function() { return { imageUrl:'', title:'' }; } 实现 我们要转发的显示内容多了一点东西:头像,用户名和点赞数.好在这个排版不是很复杂,所以我们思考了一下通过canvas去生成一张图片再return canvas所生成的图片url. 代码如下(其实还要作

  • 微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解

    最近开发一个项目时,有微信H5网页自定义分享功能,使用了微信JS-SDK的分享到好友和分享到朋友圈功能. 微信开发文档这样写的 自定义"分享给朋友"及"分享到QQ"按钮的分享内容(1.4.0) wx.ready(function () { //需在用户可能点击分享按钮前就先调用 wx.updateAppMessageShareData({ title: '', // 分享标题 desc: '', // 分享描述 link: '', // 分享链接,该链接域名或路径必

  • Vue.js源码分析之自定义指令详解

    Vue.js源码分析之自定义指令详解

    前言 除了核心功能默认内置的指令 (v-model 和 v-show),Vue 也允许注册自定义指令. 官网介绍的比较抽象,显得很高大上,我个人对自定义指令的理解是:当自定义指令作用在一些DOM元素或组件上时,该元素在初次渲染.插入到父节点.更新.解绑时可以执行一些特定的操作(钩子函数() 自定义指令有两种注册方式,一种是全局注册,使用Vue.directive(指令名,配置参数)注册,注册之后所有的Vue实例都可以使用,另一种是局部注册,在创建Vue实例时通过directives属性创建局部指

  • 微信js sdk invalid signature签名错误问题的解决方法分析

    本文实例讲述了微信js sdk invalid signature签名错误问题的解决方法.分享给大家供大家参考,具体如下: /**最近在做微信js sdk 接口调用说明*/ ***相信很多人都遇见像我这样的问题,再加上自己只能算是半个程序员,所以苦苦摸索了好久终于搞懂了. ****下面就把自己所遇见的各种问题和大家分享一下,都是自己亲手实验过的********/ 一.问题说明 如果出现 invalid signature,首先可以确定的是你的签名算法有问题. 建议:首先查看微信官方网站给出的解决

  • 微信JS SDK接入的几点注意事项(必看篇)

    微信JS SDK接入,主要可以先参考官网说明文档,总结起来有几个步骤: 1.绑定域名: 先登录微信公众平台进入"公众号设置"的"功能设置"里填写"JS接口安全域名". 备注:登录后可在"开发者中心"查看对应的接口权限. 2.引入JS文件:在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.2.0.js, 备注:支持使用 AMD/CMD 标准

  • 微信小程序 Toast自定义实例详解

    微信小程序 Toast自定义实例详解

    微信小程序 Toast自定义实例详解 实现类似于Android的Toast提示 index.js: var timer; var inputinfo = ""; var app = getApp() Page({ data: { animationData:"", showModalStatus:false }, onLoad: function () { }, showModal: function () { // 显示遮罩层 var animation = wx

  • Vue.js directive自定义指令详解

    Vue.js directive自定义指令详解

    自定义一个demo指令 Vue自定义指令语法如下: Vue.directive(id, definition) 传入的两个参数,id是指指令ID,definition是指定义对象.其中,定义对象可以提供一些钩子函数. <div id="app"> <!-- input输入框获得焦点 --> <input type="text" v-focus/> </div> <script> // 注册一个全局自定义指令

  • 微信小程序数据存储与取值详解

    微信小程序数据存储与取值详解

    在小程序开发的过程,经常要需要这个页面输入的数据,在下一个页面中进行取值赋值. 比如: 在A页面input输入框,输入电话号码,点击添加.需要在B页面电话区域中,显示刚刚输入的电话号码. 因为这是两个页面,就需要先存储,再取值.微信小程序提供了数据存储的API,wx.setStorage(OBJECT) 可以将数据存储在本地缓存中指定的 key 中,如果重复会覆盖掉原来该 key 对应的内容. 思路是,在A页面,使用bindinput获取input输入的值,赋值给一个变量(自定义),点击添加按钮

  • 微信小程序富文本渲染引擎的详解

    微信小程序富文本渲染引擎的详解 步骤 把 wxParser 目录放到小程序项目的根目录下 在需要富文本解析的 WXML 内引入 wxParser/index.wxml 在页面 JS 文件内使用 wxParser.parse(options) 方法解析 HTML 内容 在小程序项目根目录的 app.wxss 内引入 wxParser 的默认样式库 wxParser.parse(options) 方法的 options 参数说明 参数名 类型 必填 描述 bind String 是 要绑定的数据名称

  • 基于 D3.js 绘制动态进度条的实例详解

    D3 是什么 D3 的全称是(Data-Driven Documents),顾名思义可以知道是一个被数据驱动的文档.听名字有点抽象,说简单一点,其实就是一个 JavaScript 的函数库,使用它主要是用来做数据可视化的.如果你不知道什么是 JavaScript ,请先学习一下 JavaScript,推荐阮一峰老师的教程. JavaScript 文件的后缀名通常为 .js,故 D3 也常使用 D3.js 称呼.D3 提供了各种简单易用的函数,大大简化了 JavaScript 操作数据的难度.由于

  • vue.js 双层嵌套for遍历的方法详解, 类似php foreach()

    主要运用 template 标签,可相当于 php foreach() foreach(lists as $key){ //todo foreach($key.自定义字段 as k){ //todo } } <template v-for="key in lists" v-cloak> <tr> <td></td> <td ></td> <td ></td> <td ></

随机推荐