欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信JS SDK接入的幾點(diǎn)注意事項(xiàng)(必看篇)

 更新時(shí)間:2017年06月23日 07:59:41   投稿:jingxian  
下面小編就為大家?guī)硪黄⑿臞S SDK接入的幾點(diǎn)注意事項(xiàng)(必看篇)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧

微信JS SDK接入,主要可以先參考官網(wǎng)說明文檔,總結(jié)起來有幾個(gè)步驟:

1.綁定域名:

先登錄微信公眾平臺(tái)進(jìn)入“公眾號(hào)設(shè)置”的“功能設(shè)置”里填寫“JS接口安全域名”。
備注:登錄后可在“開發(fā)者中心”查看對(duì)應(yīng)的接口權(quán)限。

2.引入JS文件:在需要調(diào)用JS接口的頁面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.2.0.js,

備注:支持使用 AMD/CMD 標(biāo)準(zhǔn)模塊加載方法加載,這里補(bǔ)充引入jquery.cookie.js,sha1.js,后面需要用

3.獲取access_token,再獲取jsapi_ticket,由于不能頻繁調(diào)用獲取jsapi_ticket的函數(shù),可以保存一份全局的jsapi_ticket,存放在cookie中,如果過時(shí)了再重新獲??;另外,這兩個(gè)獲取操作建議放到服務(wù)端確保安全性;

4.拼接noncestr(隨機(jī)字符串), 有效的jsapi_ticket, timestamp(時(shí)間戳), url(當(dāng)前網(wǎng)頁的URL,不包含#及其后面部分),對(duì)所有待簽名參數(shù)按照字段名的ASCII 碼從小到大排序(字典序)后,使用URL鍵值對(duì)的格式(即key1=value1&key2=value2…)拼接成字符串string1。這里需要注意的是所有參數(shù)名均為小寫字符。

5.sha1加密生成簽名signature;

6.配置wx.config,wx.ready,wx.error等方法,其中wx.ready是配置成功之后的回調(diào),建議其他方法如微信分享wx.onMenuShareTimeline,wx.onMenuShareAppMessage之類都放到ready里面,以達(dá)到同步執(zhí)行的目的;

服務(wù)端接口:

//access_token是公眾號(hào)的全局唯一票據(jù)
  public function getTokenForJS() {
    $appid = "不告訴你";
    $secret = "不告訴你";
    $url = "https://api.weixin.qq.com/cgi-bin/token?appid=".$appid."&secret=".$secret."&grant_type=client_credential";
    $result = http_request($url);
    echo $result;exit;
  }
  
  //獲取ticket
  public function getTicket(){
    $access_token = I("get.access_token");
    $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=".$access_token."&type=jsapi";
    //$this->ajaxJSON($url);
    $result = http_request($url);
    echo $result;exit;
  }
  
  function http_request($url, $data = null)
  {
    $curl = curl_init();
    curl_setopt($curl, CURLOPT_URL, $url);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
    if (!empty($data)) {
      curl_setopt($curl, CURLOPT_POST, 1);
      curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
    }
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    $info = curl_exec($curl);
    curl_close($curl);
    return $info;
  }

前端js:

function setWechatJS() {
  // var temp = "jsapi_ticket=kgt8ON7yVITDhtdwci0qeRukvrGB1QLAfzCcybh4a_VMg6rgB4OhdsD4O2ruRI0OUPG5VfpKlYYWXcyEeChbBw&noncestr=4df32E3jY6YneEPNfGfs&timestamp=1498120656&url=http://m.galaxy-immi.com/country/";
  // alert( hex_sha1(temp)); return false;
  //生成隨機(jī)字符串
  var randomString = function(len) {
    len = len || 32;
    var $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';  /****默認(rèn)去掉了容易混淆的字符oOLl,9gq,Vv,Uu,I1****/
    var maxPos = $chars.length;
    var pwd = '';
    for (var i = 0; i < len; i++) {
      pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
    }
    return pwd;
  };

  var showShareSetting = function () {
    console.log("title="+title+",description="+description+",link="+url+",imgUrl="+imgUrl);
  };

  //wx配置參數(shù)
  var jsapi_ticket = $.cookie('jsapi_ticket');
  var hello2 = 'hello222';
  console.log("jsapi_ticket="+jsapi_ticket);

  var wxConfig = function () {
    //alert('ddd='+jsapi_ticket);
    //獲取當(dāng)前url,不含#以及之后的部分
    var timestamp = new Date().getTime(); //生成簽名的時(shí)間戳(當(dāng)前時(shí)間)
    var noncestr = randomString(20);
    var signature = '';    //簽名
    var url = window.location.href;
    var index = url.indexOf('#');
    if(index !== -1 ) {
      url = url.slice(0,index);
    }
    var temp = "jsapi_ticket="+jsapi_ticket+"&noncestr="+noncestr+"&timestamp="+timestamp+"&url="+url;
    signature = hex_sha1(temp);
    console.log("signature="+signature);
    wx.config({
      debug: false, // 開啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶端alert出來,若要查看傳入的參數(shù),可以在pc端打開,參數(shù)信息會(huì)通過log打出,僅在pc端時(shí)才會(huì)打印。
      appId: 'wx0875a197e0e5bcd7', // 必填,公眾號(hào)的唯一標(biāo)識(shí)
      timestamp: timestamp, // 必填,生成簽名的時(shí)間戳
      nonceStr: noncestr, // 必填,生成簽名的隨機(jī)串
      signature: signature,// 必填,簽名,見附錄1
      jsApiList: [
        'checkJsApi',
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo',
        'onMenuShareQZone'
      ] // 必填,需要使用的JS接口列表,所有JS接口列表見附錄2
    });

    wx.ready(function () {
      //配置成功之后回調(diào)
      console.log("微信JS SDK配置成功!");
      //實(shí)例化title\imgUrl
      title = $('title').html();  //默認(rèn)取title
      description = $("meta[name='description']").attr('content');
      //判斷當(dāng)前頁面類型取縮略圖
      $("body img").each(function(index,element){
        var width = $(element).width();
        var height = $(element).height();
        var Src = $(element).attr("src");
        if(width>200 && height>200){//去頁面中第一張寬高都大于200的圖片
          imgUrl = Src;
          //console.log(Src);
          return false;
        }else{//未在頁面中取到合適的圖片就選取銀河的logo圖
          imgUrl = MyPic+"/H5/img/icon.png";
        }
      });
      showShareSetting();
      //分享到朋友圈
      wx.onMenuShareTimeline({
        title: title, // 分享標(biāo)題
        link: url, // 分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
        imgUrl: imgUrl, // 分享圖標(biāo)
        success: function () {
          // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
          showShareSetting();
        },
        cancel: function () {
          // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)
        }
      });
      //分享給朋友
      wx.onMenuShareAppMessage({
        title: title, // 分享標(biāo)題
        desc: description, // 分享描述
        link: url, // 分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
        imgUrl: imgUrl, // 分享圖標(biāo)
        type: '', // 分享類型,music、video或link,不填默認(rèn)為link
        dataUrl: '', // 如果type是music或video,則要提供數(shù)據(jù)鏈接,默認(rèn)為空
        success: function () {
          // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
          showShareSetting();
        },
        cancel: function () {
          // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)
        }
      });
      //分享到QQ
      wx.onMenuShareQQ({
        title: title, // 分享標(biāo)題
        desc: description, // 分享描述
        link: url, // 分享鏈接
        imgUrl: imgUrl, // 分享圖標(biāo)
        success: function () {
          // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
          showShareSetting();
        },
        cancel: function () {
          // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)
        }
      });

      //分享到QQ空間
      wx.onMenuShareQZone({
        title: title, // 分享標(biāo)題
        desc: description, // 分享描述
        link: url, // 分享鏈接
        imgUrl: imgUrl, // 分享圖標(biāo)
        success: function () {
          // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
          showShareSetting();
        },
        cancel: function () {
          // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)
        }
      });
    });
    wx.error(function(res){
      console.log("微信JS SDK配置錯(cuò)誤!");
      // config信息驗(yàn)證失敗會(huì)執(zhí)行error函數(shù),如簽名過期導(dǎo)致驗(yàn)證失敗,具體錯(cuò)誤信息可以打開config的debug模式查看,也可以在返回的res參數(shù)中查看,對(duì)于SPA可以在這里更新簽名。
    });
  };

  //待分享生成的標(biāo)題、鏈接、縮略圖
  var title,url,imgUrl,description;
  //本地cookie查找不到緩存再去請(qǐng)求網(wǎng)絡(luò)
  if(typeof (jsapi_ticket) == 'undefined' || jsapi_ticket == ''){
    //alert('aaa='+jsapi_ticket);
    //以下步驟分別獲取全局access_token、jsapi_ticket、signature
    $.get(MyUrl+"getTokenForJS",function (data) {
      var access_token = data['access_token'];
      //獲取全局access_token,以及7200秒之后刷新的問題
      //先出cookie中取,如果沒有,
      $.get(MyUrl+"getTicket?access_token="+access_token,function(data){
        jsapi_ticket = data['ticket'];
        //保存當(dāng)前jsapi_ticket
        var date = new Date();
        date.setTime(date.getTime()+7200*1000);//只能這么寫,10表示10秒鐘
        //?替換成分鐘數(shù)如果為60分鐘則為 60 * 60 *1000
        $.cookie('jsapi_ticket',jsapi_ticket,{expires:date,path:'/'}); //有效期7200秒
        console.log("jsapi_ticket="+jsapi_ticket);
        //alert('ccc='+jsapi_ticket);
        wxConfig();
      },'json');

    },'json');
  }else {
    //alert('bbb='+jsapi_ticket);
    wxConfig();
  }
}

以上這篇微信JS SDK接入的幾點(diǎn)注意事項(xiàng)(必看篇)就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。

相關(guān)文章

  • 跨瀏覽器的事件對(duì)象介紹

    跨瀏覽器的事件對(duì)象介紹

    雖然IE的事件對(duì)象與DOM的事件對(duì)象存在差異,但是IE事件對(duì)象中所包含的信息和能力,與DOM事件對(duì)象是相同的,只是表現(xiàn)形式不同而已,通過映射的方式,我們可以實(shí)現(xiàn)兼容IE和DOM事件對(duì)象的事件對(duì)象
    2012-06-06
  • javascript中的altKey 和 Event屬性大全

    javascript中的altKey 和 Event屬性大全

    本文給大家介紹javascript中的altkey和event屬性大全,涉及到altkey和event屬性語法定義及用法,本文介紹的非常詳細(xì),感興趣的朋友一起看看吧
    2015-11-11
  • 微信小程序結(jié)合Storage實(shí)現(xiàn)搜索歷史效果

    微信小程序結(jié)合Storage實(shí)現(xiàn)搜索歷史效果

    這篇文章主要為大家詳細(xì)介紹了微信小程序結(jié)合Storage實(shí)現(xiàn)搜索歷史效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2019-05-05
  • bootstrap3使用bootstrap datetimepicker日期插件

    bootstrap3使用bootstrap datetimepicker日期插件

    這篇文章主要為大家詳細(xì)介紹了bootstrap3中使用bootstrap datetimepicker日期插件的用法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2017-05-05
  • 自定義require函數(shù)讓瀏覽器按需加載Js文件

    自定義require函數(shù)讓瀏覽器按需加載Js文件

    可能很多人看到這個(gè)題目就會(huì)想到LABjs、RequireJS、SeaJS... 這些庫,但無奈小編沒用過這些庫,什么 AMD 、CMD 哪來那么多術(shù)語... 前端的庫太多了,要看各種亂七八糟的文檔,好難啊,還不如自己寫一個(gè)庫呢。于是就有了這文章,有需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧。
    2016-11-11
  • javascript 具名函數(shù)的四種調(diào)用方式 推薦

    javascript 具名函數(shù)的四種調(diào)用方式 推薦

    看四種方式執(zhí)行結(jié)果沒有區(qū)別。但如果函數(shù)有返回值的話,用new方式調(diào)用時(shí)可能會(huì)讓你有些失望。
    2009-07-07
  • javascript學(xué)習(xí)總結(jié)之js使用技巧

    javascript學(xué)習(xí)總結(jié)之js使用技巧

    本篇文章給大家分享javascript學(xué)習(xí)總結(jié)之js使用技巧,都是精華喔~小伙伴快來學(xué)習(xí)吧。
    2015-09-09
  • 用Javascript實(shí)現(xiàn)發(fā)送短信驗(yàn)證碼間隔功能

    用Javascript實(shí)現(xiàn)發(fā)送短信驗(yàn)證碼間隔功能

    這篇文章主要介紹了用Javascript實(shí)現(xiàn)發(fā)送短信驗(yàn)證碼間隔功能,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2021-02-02
  • JavaScript中的ubound函數(shù)使用實(shí)例

    JavaScript中的ubound函數(shù)使用實(shí)例

    這篇文章主要介紹了JavaScript中的ubound函數(shù)使用實(shí)例,本文先是講解了ubound函數(shù)的語法,然后給出了用法代碼實(shí)例,需要的朋友可以參考下
    2014-11-11
  • 基于javascript實(shí)現(xiàn)窗口抖動(dòng)效果

    基于javascript實(shí)現(xiàn)窗口抖動(dòng)效果

    這篇文章主要介紹了基于javascript實(shí)現(xiàn)窗口抖動(dòng)效果,需要的朋友可以參考下
    2016-01-01

最新評(píng)論