微信公眾號掃一掃介面

步驟一：綁定功能變數名稱

步驟二：引入JS文件

  在需要調用JS介面的頁面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/jweixin-1.0.0.js 。(如需使用搖一搖周邊功能，請引入 jweixin-1.1.0.js)

步驟三：通過config介面註入許可權驗證配置

  所有需要使用JS-SDK的頁面必須先註入配置信息，否則將無法調用（同一個url僅需調用一次，對於變化url的SPA的web app可在每次url變化時進行調用,目前Android微信客戶端不支持pushState的H5新特性，所以使用pushState來實現web app的頁面會導致簽名失敗，此問題會在Android6.2中修複）。

wx.config({
    debug: true, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會列印。
    appId: '', // 必填，公眾號的唯一標識
    timestamp: , // 必填，生成簽名的時間戳
    nonceStr: '', // 必填，生成簽名的隨機串
    signature: '',// 必填，簽名，見附錄1
    jsApiList: [] // 必填，需要使用的JS介面列表，所有JS介面列表見附錄2
});

$.ajax({
                type: "post",
                data: { r: Math.random(), func: '',cururl:'獲取簽名的頁面地址' },
                dataType: "json",
                url: "一般處理頁",
                success: function (data) {
                    wx.config({
                        debug: false,
                        jsApiList: ['scanQRCode'],//要調用的微信介面
                        appId: data.appId,//微信開發者appId
                        timestamp: data.timpstamp,//後臺生成的時間戳
                        nonceStr: data.noncestr,//隨機字元串
                        signature: data.signature //後臺生成的簽名
                    });
                }
            });

步驟四：調起微信掃一掃介面  通過ready介面處理成功驗證

wx.ready(function(){
    // config信息驗證後會執行ready方法，所有介面調用都必須在config介面獲得結果之後，config是一個客戶端的非同步操作，所以如果需要在頁面載入時就調用相關介面，則須把相關介面放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的介面，則可以直接調用，不需要放在ready函數中。
});

wx.ready(function () {
document.querySelector('#scanQRCode').onclick = function () {
                wx.scanQRCode({
                    desc: 'scanQRCode desc',
                    needResult: 0, // 預設為0，掃描結果由微信處理，1則直接返回掃描結果，
                    scanType: ["qrCode","barCode"], // 可以指定掃二維碼還是一維碼，預設二者都有
                    success: function (res) {
                        var url = res.resultStr;
                        alert(url);
                    },
                        error: function (res) {
                            alert('error');
                        }
                });
            };
        });

        放在wx.ready 裡面的內容，會等到相關信息全部載入完畢後才可以被觸發。如果用戶引入的介面是需要點擊才會調用的，則放不放在裡面都無所謂。比如上面例子的介面是用來檢驗當前配置信息是否合法的，那麼這個功能是不需要用戶來點擊的，當你打開網頁時，自動就會調用該介面，那麼它就必須放在ready裡面。再比如我們打算調用的掃一掃，這個必須（最好是）是用戶進入頁面後點擊某個按鈕才觸發，這麼就不必放到ready裡面。

        wx.scanQRCode({ XXX });，我們給他套上一個document.querySelector（）。這個作用就是用戶點擊才會觸發該事件。如果不套document，直接放在外面那麼一旦進入該網頁，系統就自動調用了介面。
#scanQRCode這個值去掉#後，就是我們按鈕的id，擁有該id的按鈕即可調用介面。這個id是官方給的，不可以自己隨意改。(<button id="scanQRCode" >掃描二維碼</button> )

參考文章：https://blog.csdn.net/u011327333/article/details/50439462