现阶段中微信应用H5开发中,无论是何种开发语言,几乎90%的开发项目都会使用到微信的jssdk自定义分享,比较常见的分享接口主要由php引入和ajax调用这两种,使用php作为后端语言时,前端js使用ajax传送经常会出错误,所以进行写一个可通过javascript文件引入方式来实现微信自定义分享的接口。
使用这个接口,无论你是属于php开发的项目还是纯前端的html项目,无论是把代码托管到服务器还是放到OSS、CDN,都是可以的,使用这个接口是一件一劳永逸的事情。
根据微信JS-SDK的开发文档,实现微信端自定义分享主要应用到这几个步骤:
- 绑定域名;
- 引入JS文件;
- 权限验证;
- 设置自定义分享信息。
首先是要有一个通过认证的微信公众号,进入 公众号设置/功能设置/JS接口安全域名,填入分享使用到的域名,接下来就是第三步,用接口实现权限验证。
这里我们先不探讨具体的实现方法(功能在jssdk.php文件里面),先说下接口配置和分享调用方法。
分享接口配置只需填写认证的公众号AppID、AppSecret这两个参数,
- require_once "jssdk.php";
$jssdk = new JSSDK("AppID", "AppSecret", $url); // 公众号AppID、AppSecret
$signPackage = $jssdk->GetSignPackage();
echo "var signPackage=";
die(json_encode($signPackage)); // 返回微信分享所需参数
分享调用接口更方便,只需在index.html里通过javascript引入接口地址即可,
- <script>
document.write("<script src='accessToken/signPackage.php?originUrl=" + window.location.href + "' type='text/javascript'><\/script>");
</script>
<script>
var baseUrl = "http://xxx.com/"; // 分享Js接口安全域名URL
var wxData = {
"imgUrl" : baseUrl + 'share.jpg', // 分享图标
"link" : baseUrl, // 分享地址
"title" : '分享标题Title', // 分享标题
"desc" : '分享描述description' // 分享描述
};
wx.config({
debug: false,
appId: signPackage.appId,
timestamp: parseInt(signPackage.timestamp),
nonceStr: signPackage.nonceStr,
signature: signPackage.signature,
jsApiList: [
'onMenuShareTimeline',
'onMenuShareAppMessage'
]
});
wx.ready(function () {
wx.onMenuShareTimeline({
title: wxData.title,
link: wxData.link,
imgUrl: wxData.imgUrl,
success: function () {
}
});
wx.onMenuShareAppMessage({
title: wxData.title,
desc: wxData.desc,
link: wxData.link,
imgUrl: wxData.imgUrl,
type: 'link',
dataUrl: '',
success: function () {
}
});
});
</script>
大神 我是企业的服务号 只修改了AppID、AppSecret 还是没有图标和描述 这是怎么回事?域名信任也增加了
大神 我直接下载您的代码 只修改了AppID、AppSecret 可是分享还是没有图标和描述