欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

微信JSSDK的使用

程序员文章站 2022-04-28 12:20:15
微信JS-SDK 1、在微信公众平台(https://mp.weixin.qq.com/)注册个公众号,获取APPID和AppSecret 2、获取access_token(需要在公众平台中设置获取access_token的白名单),PHP示例: $APPID = “此处填写获取的APPID”; $ ......

微信js-sdk

1、在微信公众平台(https://mp.weixin.qq.com/)注册个公众号,获取appidappsecret

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);

  $ticket = $result[‘ticket’];

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>