这里只简单的介绍一下微信jssdk的配置部分,主要是签名的获取。想实现功能之前应该现在公众号中配置好安全域名,这个大家应该都会。
下面是html代码,可用保存为weixinjs.php
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
wx.config({
debug: true,
appId: '<?php echo $appid;?>',
timestamp: '<?php echo $timestamp;?>',
nonceStr: '<?php echo $nonceStr;?>',
signature: '<?php echo $signature;?>',
jsApiList: [
'chooseImage',
'uploadImage'
]
});
wx.ready(function () {
// 在这里调用 API
});
</script>
这里最主要的是这四个参数的设置
appId: <?php echo $appid;?>, //这个就是微信公众的appid
timestamp: <?php echo $timestamp;?>, //时间参数
nonceStr: '<?php echo $nonceStr;?>', //随机字符串
signature: '<?php echo $signature;?>', //签名
下面我们来重点说一下这四个参数怎么设置:
1、首先appid在自己公众号基本配置中查找。
2、时间参数这里就用当前时间:$timestamp = time();
3、随机字符串就自己随便写一个吧:$nonceStr = "iwlskio789aklwes";
4、签名,官方说的步骤是:需要四个参数,然后这四个参数拼接一下就行了。这四个参数分别是(jsapi_ticket,时间参数,随机字符串,当前域名),其中时间参数和随机字符串我们刚才已经讲过了,现在我们来分两步说一下当前域名和jsapi_ticket的获取。
首先:获取当前域名
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
这个变量url存的就是当前的域名(需要注意的是要和微信公众号中安全域名设置的是同一个域名之下,比如你这个页面是http://www.wangdai555.com/weixinjs.php那么微信安全域名就设置成www.wangdai555.com就可以了);
第二步,也是最重要的,获取签名
$appid = 'werewrsdfsd'; //你微信公众号的appid,改成自己的
$secret = 'werewrewrew'; //你微信公众号的secret,改成自己的
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";//这两步是获取当前域名的,刚才讲过了
$timestamp = time(); //时间参数,跟刚才的一样
$nonceStr = "iwlskio789aklwes"; //随机字符串,自己随便写
$url3 ='https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='.$appid.'&secret='.$secret; //这里是获取微信access_token的端口,照着写就行了
$nr3 = file_get_contents($url3);//获取微信access_token端口的返回值
$tokk = json_decode($nr3); //格式化返回值
$tok = $tokk->{'access_token'}; //从返回值中分离出access_token
$tick ='https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token='.$tok.'&type=jsapi'; //这里是获取微信ticket的端口,照着写就行了
$tick1 = file_get_contents($tick);//获取微信ticket端口的返回值
$tick2 = json_decode($tick1);//格式化返回值
$jsapi_ticket = $tick2->{'ticket'};//从返回值中分离出ticket
$pinjie = 'jsapi_ticket='.$jsapi_ticket.'&noncestr='.$nonceStr.'×tamp='.$timestamp.'&url='.$url.'';//拼接字符串
$signature = sha1($pinjie); //生成签名
好的,到现在为止config配置中需要的四个参数我们都拿到了,直接配置就行了。
下面给出完整的页面代码,直接复制保存成weixinjs.php上传到服务器就行了,记住appid和secret换成自己的。其中获取的ticket和access_token要缓存起来,因为调用次数有限,这里就不给出代码了,因为代码多了容易出错。这里只是最简洁的基本的完成配置代码,让大家熟悉流程,大家可以自己把它优化一下。
<?php
$appid = 'ewrewtrewrt';
$secret = '34234sdgfdsgfdg2354234234234';
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$timestamp = time();
$nonceStr = "iwlskio789aklwes";
$url3 ='https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='.$appid.'&secret='.$secret;
$nr3 = file_get_contents($url3);
$tokk = json_decode($nr3);
$tok = $tokk->{'access_token'};
$tick ='https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token='.$tok.'&type=jsapi';
$tick1 = file_get_contents($tick);
$tick2 = json_decode($tick1);
$jsapi_ticket = $tick2->{'ticket'};
$pinjie = 'jsapi_ticket='.$jsapi_ticket.'&noncestr='.$nonceStr.'×tamp='.$timestamp.'&url='.$url.'';
$signature = sha1($pinjie);
?>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
wx.config({
debug: true,
appId: '<?php echo $appid;?>',
timestamp: '<?php echo $timestamp;?>',
nonceStr: '<?php echo $nonceStr;?>',
signature: '<?php echo $signature;?>',
jsApiList: [
'chooseImage',
'uploadImage'
]
});
wx.ready(function () {
// 在这里调用 API
});
</script>