在2015年之前很长一段时间,微信分享功能,只需要页面埋几段js代码即可捕获用户点击分享按钮的事情,并且自定义。
但后来微信的新版本里已经屏蔽了次方法直接调用分享接口
需要在服务端坐一点开发工作。
当然你的呈现页面,比如html最终还是需要js代码,不过js代码需要做一个signature的签名处理。
只有这个正确的signature腾讯微信才允许你调用分享接口,并自定义分享菜单的内容。
页面代码如下:
var signature = "8cd09386c103dee9c2c98a8t49a126drea39f1ad";
var timestampNum = "1442538327"; //这里是时间戳,需要在服务端获取后传到客户端中。加密需要用到
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: 'wxex020f1cb01435e9', // 必填,公众号的唯一标识
timestamp: timestampNum, // 必填,生成签名的时间戳
nonceStr: timestampNum, // 必填,生成签名的随机串
signature: signature,// 必填,签名,见附录1
jsApiList: ['checkJsApi','onMenuShareTimeline','onMenuShareAppMessage','onMenuShareAppMessage','onMenuShareQQ'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});
wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。
//对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
//分享到朋友圈
wx.onMenuShareTimeline({
title: '中秋祝福2015', // 分享标题
link: 'http://weixin.xxxx.com/xxxx.php', // 分享链接
imgUrl: 'http://images.xxxx.com/xxxx/M00/00/0C/wKgF9FX2sad3f5tAAkrdgEd3146.jpg', // 分享图标
desc: "这里你可以写你需要分享的内容简介",
success: function () {
// 用户确认分享后执行的回调函数
alert("分享到朋友圈成功.");
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
//获取“分享给朋友”按钮点击状态及自定义分享内容接口
wx.onMenuShareAppMessage({
title: '中秋祝福2015', // 分享标题
desc: '这里写分享的内容简介', // 分享描述
link: 'http://weixin.xxxx.com/xxx.php', // 分享链接
imgUrl: 'http://images.xxxx.com/xxxx/M00/00/0C/wKgF9d2dff3t5tAA4fxts146.jpg', // 分享图标
type: '', // 分享类型,music、video或link,不填默认为link
dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
success: function () {
// 用户确认分享后执行的回调函数
alert("分享给朋友成功.");
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
});
wx.error(function(res){
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
});
</script>
上述代码最关键的就是获取正确的
var signature = "8cd09386c103dee9c2c98a8t49a126drea39f1ad";
腾讯微信开发文档里有介绍,比较麻烦,需要多步骤,我感觉腾讯做这个真是蛋疼,就不能简化步骤吗?
获取服务端的token还需要2次,时间也就只有7200秒,晕啊
详细可以参考下面链接
你的分享页面必须引入腾讯的js文件
http://res.wx.qq.com/open/js/jweixin-1.0.0.js
要得到上面的signature签名,比较麻烦,这里要吐槽腾讯的技术人员
首先要通过下面链接获取一个token
http请求方式: GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
这个token有效期7200秒,得到后
在拿到这个token以后,还需要通过这个token到下面链接
https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi
获取一个新的token,也就是jsapi_ticket
然后通过最后这个新的token
使用sha1加密
下面是需要加密的串
jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW×tamp=1414587457&url=http://mp.weixin.qq.com?params=value //timestamp是时间戳,在服务端获取,并存储传入页面中 url是你展示页面的完整url地址
这样把上面字符串sha1加密后,传入客户端,并写入wx.config配置的signature中即可完成操作。
相关推荐
微信公众号开发 从前台到Java后台 调用微信JS接口分享朋友圈,博客中的源代码。数据库请到博客中的GitHub链接自取,建好数据库后需要修改数据库的配置信息。
tp微信自定义分享功能demo
最近开发一个项目时,有微信H5网页自定义分享功能,使用了微信JS-SDK的分享到好友和分享到朋友圈功能。 微信开发文档这样写的 自定义“分享给朋友”及“分享到QQ”按钮的分享内容(1.4.0) wx.ready(function () {...
用ASP程序实现手机网页,获取“分享到朋友圈”按钮点击状态及自定义分享内容接口。通过asp实现以下数据:timestamp(时间戳)、access_token、jsapi_ticket、sha1加密、signature。
微信公众号号在手机中通过api接口可以实现自定义分享内容了,下面我们来看这个接口的实现步骤. 一、准备阶段 公众号一个,微网站一个. 二、绑定域名 先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS...
ASP.NET 微信JS-SDK 签名与自定义分享内容代码 开发环境: Visual Studio 2010 必须先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。 必须把项目中的微信AppID和AppSecret替换成...
分享,需要用cocopods导入第三方库,和wetchat文件夹。要不然抱错,因为只可以传5m的文件。
微信分享文章赚钱系统多用户版是一个以php MySQL进行开发的微信分享赚钱系统。 本系统增加了防作弊、防刷分功能,大家可放心使用。而且还支持系统、文章双域名快速切换绑定,完美解决被举报屏蔽。本源码运营模式...
今天想添加微信分享的功能,如果不进行自定义设计,那么当我们点击分享朋友圈、好友或者QQ好友、空间时,默认的标题就是<title>标签中的信息,而显示的描述信息就是链接,图片多是默认为页面中显示的第一张...
完整、完整重要的事说两遍,电商APP网站全新UI设计,重新界面布局,非常不错的O2O本地生活服务平台网站程序,系统主要功能包括:团购、商城、同城活动、商家、达人、讨论租、发现(分享)、优惠券、积分商城等,支持...
在许多大的网站我们都会看到点击分享就可以把数据分享到微信或QQ或其它的平台了,下面我们来看一段php版微信自定义分享代码,代码参考官方开发的没有任何问题. 分享需要认证微信订阅号或者服务号. php 代码(thinkphp...
本资源使用spring mvc框架,如果使用ssh框架,可以使用...另外这个主要是微信公众号的开发,如果是微信企业号后续会有上传专门示例的,已经实现的功能有url验证,自定义菜单创建删除,常用高级接口的使用等。
1、要实现微信H5网页自定义分享功能,必须先熟悉下微信公众平台开发文档,具体文档里面说的很详细,这里说下需要注意的点,别忘了绑定开发者权限,还有绑定js安全域名,要不然有可能会报redirect_uri参数错误。...
案例程序采用广泛流行的PHP、MySQL、XML...系统完整地介绍微信公众平台基础接口、自定义菜单、高级接口、微信支付、分享转发等所有相关技术,以生活类、娱乐类、企业类微信开发为切入点,讲解了30多个功能或应用案例。
6.2 微信支付功能介绍 114 6.2.1 方案简介 114 6.2.2 应用场景举例 115 6.2.3 商户模块 119 6.2.4 功能接口 120 6.2.5 账号体系 121 6.2.6 商户系统对接 122 6.2.7 行业案例 122 6.2.8 支付功能常见问题 ...
采用广泛流行的PHP、MySQL、XML、CSS、...系统完整地介绍微信公众平台基础接口、自定义菜单、高级接口、微信支付、分享转发等所有相关技术,以生活类、娱乐类、企业类微信开发为切入点,讲解了30多个功能或应用案例。
官方提供的书籍配套源代码,没有第一章和第六章。基础接口类、自定义菜单类、高级接口、微信支付、分享转发接口等30多个功能和应用案例。
php语言写的。h5与小程序内都可以使用微信支付来进行付款。提供使用说明。使用后觉得满意记得打个5星好评。赚积分不易
本次主要分享下小程序自定义组件的一点思路,小程序官方提供的框架比较简陋,原始,可复用较差,没有实现自定义组件的功能,这让很多使用vue ,react前端开发非常难受。网上存在各种吐槽,也有分享实现自定义组件的...