微信JS SDK Demo

微信JS SDK Demo: http://www.cnblogs.com/txw1958/p/weixin-js-sdk-demo.html

微信JSSDK接入问题记录及源码:http://my.oschina.net/lonewolf/blog/376558

微信JS-SDK说明文档http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html

1. 开启openssl功能

2. encodeURIComponent(url)

js端的要记得把当前页面的url编码,不然送给服务器的参数可能不对,最后导致签名出错。

最后附上相关的源码,包括服务端和javascript:

  • 客户端javascript
    /**
     * Author: lonewolf
     * Date: 2015-02-08 13:48:43
     */
    // 微信分享的数据
    var wxData = {
        title : ‘好玩的游戏!‘,
        desc : ‘大家快来玩!‘,
        link : ‘http://xxx‘,
        imgUrl : ‘http://xxx.png‘,
        type: ‘‘, 
        dataUrl: ‘‘, 
        success: function () {
            //分享成功
           //do something!
        }
    };
    // 配置数据
    wxConfigData={
        debug: true, //调试的时候最好设为true,它每一步都会alert数据出来,让你知道出了什么问题
        appId: ‘xxx‘,
        timestamp: 1423367602, //随便填写一串数字
        nonceStr: ‘sMADlDUaGt6DsEc6‘, //随便一字符串
        signature: ‘‘, //**这个要到服务器获取**
        jsApiList: [ //用到的功能,自定义
        ‘checkJsApi‘,
        ‘onMenuShareTimeline‘,
        ‘onMenuShareAppMessage‘,
        ‘onMenuShareQQ‘,
        ‘onMenuShareWeibo‘
        ] 
    }
    // 获取签名
    function wxGetSign () {
        var data1={};
        data1["timestamp"]=wxConfigData["timestamp"];
        data1["nonceStr"]=wxConfigData["nonceStr"];
        data1["url"]=encodeURIComponent(location.href.split(‘#‘)[0]);
        // alert(data1["url"]);
        // 自己找个ajax库
        ajax.post("wxGetSign.php?ran="+Math.random(), data1, function (data) {
            // 返回{sign:xxx}
            // alert(data);
            data=eval("("+data+")");
            if(data["sign"])
            {
                // 获取签名成功,初始化分享
                wxConfigData["signature"]=data["sign"];
                wxInit();
            }
        });
    }
    // 初始化,已经获得签名
    function wxInit () {
        // 配置参数
        wx.config(wxConfigData);
        // 分享
        wx.ready(function(){
            addWeixinShareListening();
        });
        wx.error(function(res){
            // alert(res);
        });
    }
    // 分享绑定
    function addWeixinShareListening () {
        wx.onMenuShareTimeline(wxData);
        wx.onMenuShareAppMessage(wxData);
        wx.onMenuShareQQ(wxData);
        wx.onMenuShareWeibo(wxData);
    }
    
    //执行,获取签名
    wxGetSign();
    

    相关的参数改一改,放到页面中就可以了,也可保存为一个js文件。

    • 服务端
      <?php
      /*
      因为获取的access_token以及jsapi_ticket都有时间限制(7200秒后失效),且调用接口的次数有限制,所以我们得把得到的access_token和jsapi_ticket缓存到一个文件里,每次请求都检查是否已过期。
      */
      
      //设置时区
      date_default_timezone_set(‘Asia/ShangHai‘);
      //session
      session_start();
      $returnObj = array("sign" => "");
      // 常量
      $appId="xxx";
      $appSecret="xxx";
      
      $timestamp = $_POST["timestamp"];
      $nonceStr = $_POST["nonceStr"];
      $url = $_POST["url"];
      
      if ($timestamp&&$nonceStr&&$url) {
          // 获取access_token和jsapi_ticket
          $access_token="";
          $jsapi_ticket="";
          // 保存到文件sign.txt
          $filename="sign.txt";
          $time=time();
          // 先查找本地有没有保存
          if (file_exists($filename)) {
              $str=file_get_contents($filename);
              $obj=json_decode($str,true);
              if ($obj&&$obj["access_token"]&&$obj["jsapi_ticket"]&&$obj["time"]) {
                  $lastTime=intval($obj["time"]);
                  // 标准的是7200,要少一点
                  if ($time-$lastTime<7100) {
                      $access_token=$obj["access_token"];
                      $jsapi_ticket=$obj["jsapi_ticket"];
                  }
              }
          }
          if ($access_token=="") {
              // 如果第一次或已过期则重新获取
              $returnObj["re"]=1; //这个只是测试用,看看是不是新请求
              // 获取access_token
              $tokenUrl="https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={$appId}&secret={$appSecret}";
              $str=file_get_contents($tokenUrl);
              // $returnObj["token_data"]=$str;
              $obj=json_decode($str,true);
              if ($obj&&$obj["access_token"]) {
                  $access_token=$obj["access_token"];
                  // 获取jsapi_ticket
                  $ticketUrl="https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={$access_token}&type=jsapi";
                  $str=file_get_contents($ticketUrl);
                  // $returnObj["ticket_data"]=$str;
                  $obj=json_decode($str,true);
                  if ($obj&&$obj["errcode"]==0&&$obj["ticket"]) {
                      $jsapi_ticket=$obj["ticket"];
                      // 保存文件
                      $data=array("access_token"=>$access_token,"jsapi_ticket"=>$jsapi_ticket,"time"=>$time);
                      $data=json_encode($data);
                      file_put_contents($filename, $data);
                  }
                  else
                  {
                      $returnObj["error"]="wrong ticket";
                  }
              }
              else
              {
                  $returnObj["error"]="wrong access_token";
              }
          }
          if ($access_token&&$jsapi_ticket) {
              // test
              // $returnObj["access_token"]=$access_token;
              // $returnObj["jsapi_ticket"]=$jsapi_ticket;
              // 签名算法
              $str="jsapi_ticket={$jsapi_ticket}&noncestr={$nonceStr}&timestamp={$timestamp}&url={$url}";
              // $returnObj["signstr"]=$str;
              $sign=sha1($str);
              $returnObj["sign"]=$sign;
          }
      }
      echo json_encode($returnObj);
      ?>
      

       

微信JS SDK Demo

上一篇:【服务号】微信公众号接入过程笔记


下一篇:微信公众号