亲测：ThinkPHP 调用微信JS-SDK 开发详解

转自http://my.oschina.net/superkangning/blog/368043

一：准备文件，并将文件置于网站根目录下

    access_token.json

{ "access_token" : "" , "expire_time" :0}

    jsapi_ticket.json

{ "jsapi_ticket" : "" , "expire_time" :0}

    jssdk.php

 <?php
class  JSSDK {
  private  $appId ;
  private  $appSecret ;
  public  function  __construct( $appId ,  $appSecret ) {
    $this ->appId =  $appId ;
    $this ->appSecret =  $appSecret ;
  }
  public  function  getSignPackage() {
    $jsapiTicket  =  $this ->getJsApiTicket();
    $url  =  "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]" ;
    $timestamp  = time();
    $nonceStr  =  $this ->createNonceStr();
    // 这里参数的顺序要按照 key 值 ASCII 码升序排序
    $string  =  "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr&timestamp=$timestamp&url=$url" ;
    $signature  = sha1( $string );
    $signPackage  =  array (
      "appId"      =>  $this ->appId,
      "nonceStr"   =>  $nonceStr ,
      "timestamp"  =>  $timestamp ,
      "url"        =>  $url ,
      "signature"  =>  $signature ,
      "rawString"  =>  $string
    );
    return  $signPackage ;
  }
  private  function  createNonceStr( $length  = 16) {
    $chars  =  "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789" ;
    $str  =  "" ;
    for  ( $i  = 0;  $i  <  $length ;  $i ++) {
      $str  .=  substr ( $chars , mt_rand(0,  strlen ( $chars ) - 1), 1);
    }
    return  $str ;
  }
  private  function  getJsApiTicket() {
    // jsapi_ticket 应该全局存储与更新，以下代码以写入到文件中做示例
    $data  = json_decode( file_get_contents ( "jsapi_ticket.json" ));
    if  ( $data ->expire_time < time()) {
      $accessToken  =  $this ->getAccessToken();
      $url  =  "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken" ;
      $res  = json_decode( $this ->httpGet( $url ));
      $ticket  =  $res ->ticket;
      if  ( $ticket ) {
        $data ->expire_time = time() + 7000;
        $data ->jsapi_ticket =  $ticket ;
        $fp  =  fopen ( "jsapi_ticket.json" ,  "w" );
        fwrite( $fp , json_encode( $data ));
        fclose( $fp );
      }
    }  else  {
      $ticket  =  $data ->jsapi_ticket;
    }
    return  $ticket ;
  }
  private  function  getAccessToken() {
    // access_token 应该全局存储与更新，以下代码以写入到文件中做示例
    $data  = json_decode( file_get_contents ( "access_token.json" ));
    if  ( $data ->expire_time < time()) {
      $url  =  "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$this->appId&secret=$this->appSecret" ;
      $res  = json_decode( $this ->httpGet( $url ));
      $access_token  =  $res ->access_token;
      if  ( $access_token ) {
        $data ->expire_time = time() + 7000;
        $data ->access_token =  $access_token ;
        $fp  =  fopen ( "access_token.json" ,  "w" );
        fwrite( $fp , json_encode( $data ));
        fclose( $fp );
      }
    }  else  {
      $access_token  =  $data ->access_token;
    }
    return  $access_token ;
  }
  private  function  httpGet( $url ) {
    $curl  = curl_init();
    curl_setopt( $curl , CURLOPT_RETURNTRANSFER, true);
    curl_setopt( $curl , CURLOPT_TIMEOUT, 500);
    curl_setopt( $curl , CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt( $curl , CURLOPT_SSL_VERIFYHOST, false);
    curl_setopt( $curl , CURLOPT_URL,  $url );
    $res  = curl_exec( $curl );
    curl_close( $curl );
    return  $res ;
  }
}

二：编辑显示页面对应的后台PHP文件，添加如下代码

      include ( 'jssdk.php' );
      $jssdk  =  new  JSSDK( "APPID" ,  "APPSECRET" );
      $signPackage  =  $jssdk ->GetSignPackage();

      $this ->signPackage =  $signPackage ;

请将APPID和APPSECRET换成您自己微信账号的信息

三：编辑显示页面模板html文件，添加如下代码

< script  src = "http://res.wx.qq.com/open/js/jweixin-1.0.0.js" ></ script >
< script >
wx.config({
    appId: '{suetech:$signPackage.appId}',
    timestamp: {suetech:$signPackage.timestamp},
    nonceStr: '{suetech:$signPackage.nonceStr}',
    signature: '{suetech:$signPackage.signature}',
   jsApiList: [
        'checkJsApi',
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo'
      ]
  });
  /*
 * 注意：
 * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
 * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
 * 3. 完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
 *
 * 如有问题请通过以下渠道反馈：
 * 邮箱地址：[email protected]
 * 邮件主题：【微信JS-SDK反馈】具体问题
 * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
 */
wx.ready(function () {
  // 1 判断当前版本是否支持指定 JS 接口，支持批量判断
    wx.checkJsApi({
      jsApiList: [
        'getNetworkType',
        'previewImage',
         'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo'
      ],
      success: function (res) {
        alert(JSON.stringify(res));
      }
    });
  var shareData = {
    title: '标题',
      desc: '描述',
      link: '链接',
      imgUrl: '图片',
      trigger: function (res) {
        alert('用户点击发送给朋友');
      },
      success: function (res) {
        alert('已分享');
      },
      cancel: function (res) {
        alert('已取消');
      },
      fail: function (res) {
        alert(JSON.stringify(res));
      }
  };
  wx.onMenuShareAppMessage(shareData);
  wx.onMenuShareTimeline(shareData);
  wx.onMenuShareQQ(shareData);
  wx.onMenuShareWeibo(shareData);
});
wx.error(function (res) {
  alert(res.errMsg);
});
</ script >

到此已经能够正常进行微信自定义分享了

需要注意的地方是在微信公众账号中配置您的域名，设置方法：

登陆微信公众账号->公众号设置->功能设置->JS接口安全域名->设置