。
查了网上的资料和微信开发文档,是微信为安全原因,防止类似钓鱼网址等非法链接做的安全措施。为了实现上述功能,我们需要在网站中加入动态代码,调用微信sdk接口,获得认证。
微信说明文档链接
https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
- 根据开发说明,我们首先需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。(备注:登录后可在“开发者中心”查看对应的接口权限。)
首先登陆微信开发者平台,在 开发-接口权限 中打开相应接口,
-
进入 设置-公众号设置,打开 功能设置 标签,在 JS接口安全域名内 添加需要调用微信js接口网页的域名。
设置JS接口安全域名时,微信会要求开发者下载一个文件,并上传到填写的域名下。完成操作后,安全域名就添加成功了。
简单浏览了一下开发文档,直接下载页面最后的sample测试代码。在php文件夹中四个文件
access_token.php
jsapi_ticket.php
jssdk.php
sample.php
其中,sample.php是demo页面。
jssdk.php中整合了获得config中需要的timestamp,nonceStr,signature及中间数据access_token,jsapi_ticket等函数。
access_token.php及jaspi_ticket.php是空的,用来全局存在这两个变量。微信规定access_token的有效期7200秒,而且每天调用不能超过2000次,所有需要全局存储,在有效周期内从本地获得。打开 php 文件中sample.php
<?php
require_once "jssdk.php";
$jssdk = new JSSDK("yourAppID", "yourAppSecret");
$signPackage = $jssdk->GetSignPackage();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
wx.config({
debug: true,
appId: '<?php echo $signPackage["appId"];?>',
timestamp: <?php echo $signPackage["timestamp"];?>,
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: [
// 所有要调用的 API 都要加到这个列表中
]
});
wx.ready(function () {
// 在这里调用 API
});
</script>
</html>
在 $jssdk = new JSSDK("yourAppID", "yourAppSecret"); 处需要添加AppID及AppSecret。
在需要调用JS接口的页面引入如下JS文件,(http://res.wx.qq.com/open/js/jweixin-1.0.0.js)
如果你的页面启用了https,需要引入(https://res.wx.qq.com/open/js/jweixin-1.0.0.js) ,否则将无法在iOS9.0以上系统中成功使用JSSDK。
另外,我们看到下面有一个标签<IP白名单>,在这里需要添加我们访问来源的IP地址,只有白名单里面的ip地址访问,才能获得access_token,并成功调用微信开发接口。
这个ip地址,是服务端所在服务器的地址,可以通过服务器提供商出获得。经过测试,如有需要本地pc端测试,好像还需要将本地的ip加入。如果不确定ip地址的话,可以先不填。调试过程中,他会返回某ip地址未在白名单中的提示,直接把这个地址加入,就可以了。
-
上传测试文件到服务器。因为我们在config中设置了debug为true,所以每次调用都可以看到反馈信息。
登陆页面,跳出对话框
说明签名没有被正确得到。
调试jsjdk.php中,我们发现获得access_token为空。查看httpGet函数返回信息,
private function httpGet($url) {
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_TIMEOUT, 500);
// 为保证第三方服务器与微信服务器之间数据传输的安全性,所有微信接口采用https方式调用,必须使用下面2行代码打开ssl安全校验。
// 如果在部署过程中代码在此处验证失败,请到 http://curl.haxx.se/ca/cacert.pem 下载新的证书判别文件。
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, true);
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);
curl_setopt($curl, CURLOPT_URL, $url);
$res = curl_exec($curl);
curl_close($curl);
echo $res;//显示数据
return $res;
}
首先下载新的ssl安全校验证书cacert.pem,保持到根目录下。
好的,现在把这个ip地址加入到微信公众平台的ip白名单中。
再次调用
显示成功。
截止到现在,这个过程就基本调试通过了。
- 在sample.php中加入我们要分享的信息
wx.ready(function(){
var shareData = {
title: '中国船舶工业集团公司',
desc: '中国船舶工业集团公司',
link: 'http://www.flashtek.com.cn/cssc/index.php',
imgUrl: 'http://www.flashtek.com.cn/cssc/img/logo.png'
};
wx.onMenuShareAppMessage(shareData);
wx.onMenuShareTimeline(shareData);
});