微信JSSDK的使用

微信JS-SDK

1、在微信公众平台（https://mp.weixin.qq.com/）注册个公众号，获取APPID和AppSecret

2、获取access_token（需要在公众平台中设置获取access_token的白名单），PHP示例：

　　$APPID = “此处填写获取的APPID”;

　　$appSecret =”此处填写获取的AppSecret”;

　　$token_access_url=“https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=” . $APPID . ”&secret=” . $appSecret;

　　$result = file_get_contents($token_access_url);

　　$resultArr = json_decode($result,true);

$access_token = $resultArr['access_token'];

3、通过access_token获取jsapi_ticket，PHP示例：

　　$ticket_url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={$access_token}&type=jsapi";

　　$res = file_get_contents($ticket_url);

　　$resArr = json_decode($res,true);

　　$ticket = $result['ticket'];

4、生成签名的随机字符串

　　function getRandChar($length){

　　　　$str = null;

　　　　$strPol = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789abcdefghijklmnopqrstuvwxyz";

　　　　$max = strlen($strPol)-1;

　　　　for($i = 0;$i<$length;$i++){

　　　　　　$str .= $strPol[rand(0,$max)];

　　　　}

　　　　return $str;

　　}

　　$noncestr = getRandChar(16);

5、生成签名的时间戳

　　$timestamp = time();

6、生成签名

if ($_SERVER['QUERY_STRING']){
    $url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING'];
}else{
    $url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'];
}

　　$parameters = array(

　　　　"noncestr" => $noncestr,

　　　　"jsapi_ticket" => $ticket,

　　　　"$timestamp" => $timestamp,

　　　　"url" => $url,

　　)

　　ksort($parameters);

　　$string = "";

　　foreach($parameters as $k => $v){

　　　　$string .= $k."=".$v."&";

　　}

　　$string_sha = substr($string,0,-1);

　　$signature = sha1($string_sha );

7、设置公众号JS安全域名：.

　　微信公众平台的公众号设置→功能设置。根据规则添加JS接口安全域名

8、引入JS文件:

　　<script src = "https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

9、配置设置，示例：

　　<script>

　　　　wx.config([

　　　　　　debug:false,//调试模式，开启时会弹出返回值，PC端会通过log打印

　　　　　　appId:'<?php echo $APPID; ?>',//必填，上面已经获取到的APPID

　　　　　　timestamp:<?php echo $timestamp; ?>,//必填，生成签名的时间戳

　　　　　　nonceStr:'<?php echo $noncestr; ?>',//必填，生成签名的随机字符串

　　　　　　signature:'<?php echo $signature; ?>',//必填，签名

　　　　　　jsApiList:[

　　　　　　　　'onMenuShareAppMessage',

　　　　　　　　'onMenuShareTimeline'

　　　　　　]//必填，需要使用的JS接口列表，所有JS接口列表见附录2,某些接口需要进行接口授权（微信公众平台→开发→接口权限）才可以使用

　　　　});

　　</script>

10、使用接口，可以用微信开发者工具测试

　　
　　<script>

wx.ready(function () {
    // 2. 分享接口
    // 2.1 监听“分享给朋友”，按钮点击、自定义分享内容及分享结果接口
        wx.onMenuShareAppMessage({
            title: '互联网之子',
            desc: '在长大的过程中，我才慢慢发现，我身边的所有事，别人跟我说的所有事，那些所谓本来如此，注定如此的事，它们其实没有非得如此，事情是可以改变的。更重要的是，有些事既然错了，那就该做出改变。',
            link: 'http://movie.douban.com/subject/25785114/',
            imgUrl: 'http://demo.open.weixin.qq.com/jssdk/images/p2166127561.jpg',
            trigger: function (res) {
                // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
                alert('用户点击发送给朋友');
            },
            success: function (res) {
                alert('已分享');
            },
            cancel: function (res) {
                alert('已取消');
            },
            fail: function (res) {
                alert(JSON.stringify(res));
            }
        });

    // 2.2 监听“分享到朋友圈”按钮点击、自定义分享内容及分享结果接口
        wx.onMenuShareTimeline({
            title: '互联网之子',
            link: 'http://movie.douban.com/subject/25785114/',
            imgUrl: 'http://demo.open.weixin.qq.com/jssdk/images/p2166127561.jpg',
            trigger: function (res) {
                // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容，因为客户端分享操作是一个同步操作，这时候使用ajax的回包会还没有返回
                alert('用户点击分享到朋友圈');
            },
            success: function (res) {
                alert('已分享');
            },
            cancel: function (res) {
                alert('已取消');
            },
            fail: function (res) {
                alert(JSON.stringify(res));
            }
        });

});
</script>