微信分享自定义款式

微信分享到朋侪圈&微信分享给朋侪自定义图文信息

原本效果:

预期效果:

参考:微信开发者文档js-sdk

须要预备的:

**经由过程微信认证的民众号**
**有备案过的域名**


步骤:

背景须要完成的事变:

1.登录微信民众平台进入“民众号设置”的“功用设置”里填写“JS接口平安域名”,(挪用的url必需在js接口平安域名能够 )

2.登录后可在“开发者中间”检察对应的接口权限,认证过的民众号都能够调大多数接口。

3.天生js-sdk的权限署名:jsapi_ticket 参照js-sdk权限署名文档

前端须要干的事变:
1.在须要挪用JS接口的页面引入以下JS文件，（支撑https）：http://res.wx.qq.com/open/js/&＃8230;
备注：支撑运用 AMD/CMD 规范模块加载要领加载

2.前端经由过程发送要求猎取署名权限或许背景言语嵌入html (题主公司直接用的内嵌php),因为署名权限出于平安题目只能经由过程背景完成

3.经由过程config接口注入权限考证设置,参数由背景供应,选项debug上线后记得设置成false

wx.config({
debug: true, // 开启调试形式,挪用的一切api的返回值会在客户端alert出来，若要检察传入的参数，能够在pc端翻开，参数信息会经由过程log打出，仅在pc端时才会打印。
appId: '', // 必填，民众号的唯一标识
timestamp: , // 必填，天生署名的时刻戳
nonceStr: '', // 必填，天生署名的随机串
signature: '',// 必填，署名
jsApiList: [] // 必填，须要运用的JS接口列表
});

一切须要运用JS-SDK的页面必需先注入设置信息，否则将没法挪用（同一个url仅需挪用一次，关于变化url的SPA的web app可在每次url变化时举行挪用,现在Android微信客户端不支撑pushState的H5新特征，所以运用pushState来完成web app的页面会致使署名失利，此题目会在Android6.2中修复）。

4.经由过程ready接口处置惩罚胜利考证,考证失利进入error回调函数

wx.ready(function(){
// config信息考证后会实行ready要领，一切接口挪用都必需在config接口取得效果以后，config是一个客户端的异步操纵，所以假如须要在页面加载时就挪用相干接口，则须把相干接口放在ready函数中挪用来确保准确实行。关于用户触发时才挪用的接口，则能够直接挪用，不须要放在ready函数中。
});

5.经由过程error接口处置惩罚失利考证
考证失利多是因为署名逾期或许没有接收到等缘由致使的

wx.error(function(res){
// config信息考证失利会实行error函数，如署名逾期致使考证失利，详细错误信息能够翻开config的debug形式检察，也能够在返回的res参数中检察，关于SPA能够在这里更新署名。
});

6.在ready函数里写分享的代码
请注意不要有引诱分享等违规行动，关于引诱分享行动将永远接纳民众号接口权限
分享朋侪圈代码:

//猎取“分享到朋侪圈”按钮点击状况及自定义分享内容接口
wx.onMenuShareTimeline({
title: '', // 分享题目
link: '', // 分享链接，该链接域名或途径必需与当前页面对应的民众号JS平安域名一致
imgUrl: '', // 分享图标 这个图片地点须要填写绝对途径 www.xxx.com/images/xxx.jpg
success: function () {
// 用户确认分享后实行的回调函数
},
cancel: function () {
// 用户作废分享后实行的回调函数
}
});

分享给朋侪代码

wx.onMenuShareAppMessage({
title: '', // 分享题目
desc: '', // 分享形貌
link: '', // 分享链接，该链接域名或途径必需与当前页面对应的民众号JS平安域名一致
imgUrl: '', // 分享图标 这个图片地点须要填写绝对途径 www.xxx.com/images/xxx.jpg
type: '', // 分享范例,music、video或link，不填默以为link
dataUrl: '', // 假如type是music或video，则要供应数据链接，默以为空
success: function () {
// 用户确认分享后实行的回调函数
},
cancel: function () {
// 用户作废分享后实行的回调函数
}
});

本身写的时刻遇到的bug:
因为前后端没有星散,在经由过程config接口注入权限考证设置时须要把js代码写在html文件中才猎取到参数,零丁写成一个js文件读取不到

以上就是悉数代码,有错迎接指出,看到就会改,希望能帮到你!