1. 程式人生 > >微信公眾號介面除錯流程

微信公眾號介面除錯流程

微信公眾號開發追重要的就是要把微信與雲連線起來。

1.進入測試

2.申請好雲:

3.開始配置:

  • 1.不管怎麼樣,先在雲空間里根目錄下放置了一個token/index.php檔案,這個檔案的內容為(另存檔案index.php)

index.php裡的token值,這個值是可以變的,但是要和微信公眾號裡的token值一一對應。

  • 2.理解這個index.php檔案是幹嘛的?是為了驗證我們的這個微信賬號能夠與我們的空間裡的內容進行銜接。
  • 2.1 設定微信公眾號裡的“伺服器配”,輸入Url和token(還要在開發者工具裡的公眾號測試帳號裡再設定一個url和token)這兩者設定的應該是一模一樣。(這兩者設定,是為了和新浪雲空間裡的Index.php進行驗證。)
  • 2.2 我們只需要配置url、token按鈕成功了,我們的token認證過程,就完成了。
  • 3.JS介面安全域名的配置(千萬注意不要有http://和/index.php這些內容)
  • 3.1需要用我們的手機微信,掃描測試帳號的二維碼;
  • JS-SDK---> JavaScript Software Development Kit

 

  • 4.上傳sample.zip下的php.zip,或者是上傳自己的個人簡介專案到新浪雲空間;(上傳專案)
  • 5.千萬注意將access_token.php、jsapi_ticket.php和jssdk.php三個php檔案放置在我們專案的同一級目錄;
  • 6.修改我們的主檔案,比如index.html,將它修改成index.php字尾檔案(修改檔案字尾),將在它最上面加入:

<?php
require_once "jssdk.php";
$jssdk = new JSSDK("wxa296e9f72961b27a", "00d042cf8a330644509e4d65f005e751");
$signPackage = $jssdk->GetSignPackage();
?>
這一段程式碼,注意jssdk的引數,一個是appId,另一個是appSecret,修改成自己的引數值;

  • 7.加入wenxi支援的js類庫:  <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
  • 8.獲取簽名等動態的變數資訊,然後加入到wx的配置資訊裡進行驗證:

wx.config({
            debug: true,
            appId: '<?php echo $signPackage["appId"];?>',
            timestamp: <?php echo $signPackage["timestamp"];?>,
            nonceStr: '<?php echo $signPackage["nonceStr"];?>',
            signature: '<?php echo $signPackage["signature"];?>',
            jsApiList: [
              // 所有要呼叫的 API 都要加到這個列表中
            'scanQRCode','chooseImage'
            ]
          });
  這裡千萬注意jsApiList裡,想要呼叫哪些一些weixin的api就寫哪一些,不用的,不要寫。

  • 9.在配置完成以後我們可以寫wx.ready()....這裡是wx操作的一些初始化工作內容。
  • 10.注意:如果說我們把微信操作放置到我們自己的一些按鈕,或者a標籤裡進行呼叫的話,我們需要將微信操作的具體內容放置到函式中去,而這個函數千萬不要放到wx.ready裡面,需要將它們放置到外面來。

function chooseImg(){

    wx.chooseImage({
        count: 1, // 預設9
        sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有
        sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機,預設二者都有
        success: function (res) {
            var localIds = res.localIds; // 返回選定照片的本地ID列表,localId可以作為img標籤的src屬性顯示圖片
        }
    });
}

  • 11.將我們的index.php進行瀏覽,並檢視它的url,將這個url生成為二維碼;
  • 12.開啟我們的微信,進行二維碼掃描,然後進行後續操作。
  • 13.jssdk的呼叫算是成功完成。
  • 14.新建立一個getSign.php檔案,將sample.php最上面簽名輸出的程式碼複製貼上到該檔案中,並進行內容的輸出

<?php
require_once "jssdk.php";
$jssdk = new JSSDK("wxa296e9f72961b27a", "00d042cf8a330644509e4d65f005e751");
$signPackage = $jssdk->GetSignPackage($_POST['url']);
echo json_encode($signPackage); 
?>
而且需要注意$_POST['url']引數的獲取

  • 15.建立一個index.html,在該檔案中進行jquery的ajax請求操作,需要將url:window.location.href當成引數進行傳遞請求
  • 16.修改jssdk,第12行  public function getSignPackage($url) {中需要將$url引數傳遞進去;
  • 17.修改jssdk,第17行,    $url = $url ? $url : "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";修改成三目運算子,如果有引數,則對傳遞過來的引數地址進行加密操作,如果沒有引數,自動獲取當前地址加密;
  • 18.補充:我們需要在微信公眾號裡設定自定義選單,但是由於我們未認證或者許可權不足,我們只能發圖文資訊,需要通過原文連結進行url的外鏈,點選到我們的專案地址。在實現這個操作之前,需要我們掃描正式的二維碼(在公眾號設定裡)