js中調(diào)用微信的掃描二維碼功能的實(shí)現(xiàn)代碼
關(guān)鍵代碼
<html> <head> <title> js調(diào)用微信掃一掃功能測(cè)試 </title> <!--引用微信JS庫(kù)--> <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> <!--引用jQuery庫(kù)--> <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> </head> <body> <input type="button" value="掃一掃" id="scanQRCode"> <script type="text/javascript"> //這里【url參數(shù)一定是去參的本網(wǎng)址】 $.get("獲取微信認(rèn)證參數(shù)的網(wǎng)址?url=當(dāng)前網(wǎng)頁(yè)的網(wǎng)址", function(data){ var jsondata=$.parseJSON(data); wx.config({ // 開(kāi)啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶端alert出來(lái),若要查看傳入的參數(shù),可以在pc端打開(kāi),參數(shù)信息會(huì)通過(guò)log打出,僅在pc端時(shí)才會(huì)打印。 debug: false, // 必填,公眾號(hào)的唯一標(biāo)識(shí) appId: jsondata.model.appId, // 必填,生成簽名的時(shí)間戳 timestamp: "" + jsondata.model.timestamp, // 必填,生成簽名的隨機(jī)串 nonceStr: jsondata.model.nonceStr, // 必填,簽名 signature: jsondata.model.signature, // 必填,需要使用的JS接口列表 jsApiList: ['checkJsApi', 'scanQRCode'] }); }); wx.error(function (res) { alert("出錯(cuò)了:" + res.errMsg);//這個(gè)地方的好處就是wx.config配置錯(cuò)誤,會(huì)彈出窗口哪里錯(cuò)誤,然后根據(jù)微信文檔查詢即可。 }); wx.ready(function () { wx.checkJsApi({ jsApiList: ['scanQRCode'], success: function (res) { } }); //點(diǎn)擊按鈕掃描二維碼 document.querySelector('#scanQRCode').onclick = function () { wx.scanQRCode({ needResult: 1, // 默認(rèn)為0,掃描結(jié)果由微信處理,1則直接返回掃描結(jié)果, scanType: ["qrCode"], // 可以指定掃二維碼還是一維碼,默認(rèn)二者都有 success: function (res) { var result = res.resultStr; // 當(dāng)needResult 為 1 時(shí),掃碼返回的結(jié)果 alert("掃描結(jié)果:"+result); window.location.href = result;//因?yàn)槲疫@邊是掃描后有個(gè)鏈接,然后跳轉(zhuǎn)到該頁(yè)面 } }); }; }); </script> </body> </html>
注意事項(xiàng):
“獲取微信認(rèn)證參數(shù)”
這個(gè)的前提是您能夠有自己的微信開(kāi)發(fā)資質(zhì),并能獲取到正確的參數(shù)
- 公眾號(hào)的唯一標(biāo)識(shí)
- 簽名的時(shí)間戳
- 簽名隨機(jī)串
常見(jiàn)的錯(cuò)誤
config:invalid signature
解決辦法
“當(dāng)前網(wǎng)頁(yè)的地址”-----哈哈,一定是你寫的不對(duì),這里一定是去參的本網(wǎng)頁(yè)的地址
最好是在服務(wù)器下去測(cè)試
總結(jié)
到此這篇關(guān)于在js中調(diào)用微信的掃描二維碼功能的文章就介紹到這了,更多相關(guān)js 微信掃描二維碼內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript Math對(duì)象和調(diào)試程序的方法分析
這篇文章主要介紹了JavaScript Math對(duì)象和調(diào)試程序的方法,結(jié)合實(shí)例形式分析了javascript中Math對(duì)象生成隨機(jī)數(shù)以及使用alert()、console.log()函數(shù)進(jìn)行錯(cuò)誤調(diào)試相關(guān)操作技巧,需要的朋友可以參考下2019-05-05require.js與bootstrap結(jié)合實(shí)現(xiàn)簡(jiǎn)單的頁(yè)面登錄和頁(yè)面跳轉(zhuǎn)功能
這篇文章主要介紹了require.js與bootstrap結(jié)合實(shí)現(xiàn)簡(jiǎn)單的頁(yè)面登錄和頁(yè)面跳轉(zhuǎn)功能,需要的朋友可以參考下2017-05-05微信小程序?qū)崿F(xiàn)簡(jiǎn)單計(jì)算器
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)懞?jiǎn)單計(jì)算器,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-04-04使用watch在微信小程序中實(shí)現(xiàn)全局狀態(tài)共享
這篇文章主要給大家介紹了關(guān)于如何使用watch在小程序中實(shí)現(xiàn)全局狀態(tài)共享的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用微信小程序具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06javascript 高級(jí)語(yǔ)法之繼承的基本使用方法示例
這篇文章主要介紹了javascript 高級(jí)語(yǔ)法之繼承的基本使用方法,結(jié)合實(shí)例形式分析了JavaScript繼承的基本使用方法與操作注意事項(xiàng),需要的朋友可以參考下2019-11-11手把手教你實(shí)現(xiàn)一個(gè)JavaScript時(shí)間軸組件
本文主要是給大家?guī)?lái)一個(gè)時(shí)間軸的組件開(kāi)發(fā)教程,其主要功能就是可以拖動(dòng)時(shí)間軸來(lái)定位當(dāng)前時(shí)間,可以通過(guò)鼠標(biāo)滾輪來(lái)修改當(dāng)前時(shí)間分辨率,需要的可以參考一下2022-10-10Web前端開(kāi)發(fā)工具——bower依賴包管理工具
Bower 是 twitter 推出的一款包管理工具,基于nodejs的模塊化思想,把功能分散到各個(gè)模塊中,讓模塊和模塊之間存在聯(lián)系,通過(guò) Bower 來(lái)管理模塊間的這種聯(lián)系,本文給大家介紹bower依賴包管理工具,感興趣的朋友一起學(xué)習(xí)2016-03-03