微信掃一掃開發

阿新 • • 發佈：2019-02-12

wx.config({ debug: true, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來，若要檢視傳入的引數，可以在pc端開啟，引數資訊會通過log打出，僅在pc端時才會列印。 appId: '${appId}', // 必填，公眾號的唯一標識 timestamp: '${ timestamp}' , // 必填，生成簽名的時間戳 nonceStr: '${ nonceStr}', // 必填，生成簽名的隨機串 signature: '${ signature}',// 必填，簽名，見附錄1 jsApiList: ['checkJsApi'

, 'chooseImage', 'previewImage', 'uploadImage', 'downloadImage', 'getNetworkType',//網路狀態介面 'openLocation',//使用微信內建地圖檢視地理位置介面 'getLocation', //獲取地理位置介面 'hideOptionMenu',//介面操作介面1

'showOptionMenu',//介面操作介面2 'closeWindow' , ////介面操作介面3 'hideMenuItems',////介面操作介面4 'showMenuItems',////介面操作介面5 'hideAllNonBaseMenuItem',////介面操作介面6 'showAllNonBaseMenuItem',////介面操作介面7 'scanQRCode'

// 微信掃一掃介面 ] // 必填，需要使用的JS介面列表，所有JS介面列表見附錄2 }); wx.ready(function(){ // 5 圖片介面 // 5.1 拍照、本地選圖 var images = { localId: [], serverId: [] }; document.querySelector('#chooseImage').onclick = function () { wx.chooseImage({ success: function (res) { images.localId = res.localIds; alert('已選擇 ' + res.localIds.length + ' 張圖片'); $("#faceImg").attr("src", res.localIds[0]);//顯示圖片到頁面上 } }); }; // 5.2 圖片預覽 document.querySelector('#previewImage').onclick = function () { wx.previewImage({ current: 'http://www.vxzsk.com/upload//bf04c9b5-5699-421d-900e-3b68bbe58a8920160816.jpg', urls: [ 'http://www.vxzsk.com/upload//bf04c9b5-5699-421d-900e-3b68bbe58a8920160816.jpg', 'http://www.vxzsk.com/upload//bf04c9b5-5699-421d-900e-3b68bbe58a8920160816.jpg', 'http://www.vxzsk.com/upload//bf04c9b5-5699-421d-900e-3b68bbe58a8920160816.jpg' ] }); }; // 5.3 上傳圖片 document.querySelector('#uploadImage').onclick = function () { if (images.localId.length == 0) { alert('請先使用 chooseImage 介面選擇圖片'); return; } var i = 0, length = images.localId.length; images.serverId = []; function upload() { wx.uploadImage({ localId: images.localId[i], success: function (res) { i++; //alert('已上傳：' + i + '/' + length); images.serverId.push(res.serverId); if (i < length) { upload(); } }, fail: function (res) { alert(JSON.stringify(res)); } }); } upload(); }; // 5.4 下載圖片 document.querySelector('#downloadImage').onclick = function () { if (images.serverId.length === 0) { alert('請先使用 uploadImage 上傳圖片'); return; } var i = 0, length = images.serverId.length; images.localId = []; function download() { wx.downloadImage({ serverId: images.serverId[i], success: function (res) { i++; alert('已下載：' + i + '/' + length); images.localId.push(res.localId); if (i < length) { download(); } } }); } download(); }; // 6 裝置資訊介面 // 6.1 獲取當前網路狀態 document.querySelector('#getNetworkType').onclick = function () { wx.getNetworkType({ success: function (res) { alert(res.networkType); }, fail: function (res) { alert(JSON.stringify(res)); } }); }; //網路介面結束 // 7 地理位置介面開始 // 7.1 檢視地理位置 document.querySelector('#openLocation').onclick = function () { wx.openLocation({ latitude: 23.099994, longitude: 113.324520, name: 'TIT 創意園', address: '廣州市海珠區新港中路 397 號', scale: 14, infoUrl: 'http://weixin.qq.com' }); }; // 7.2 獲取當前地理位置 document.querySelector('#getLocation').onclick = function () { wx.getLocation({ success: function (res) { alert(JSON.stringify(res)); }, cancel: function (res) { alert('使用者拒絕授權獲取地理位置'); } }); }; // 7 地理位置介面結束 // 8 介面操作介面開始----------- // 8.1 隱藏右上角選單 document.querySelector('#hideOptionMenu').onclick = function () { wx.hideOptionMenu(); }; // 8.2 顯示右上角選單 document.querySelector('#showOptionMenu').onclick = function () { wx.showOptionMenu(); }; // 8.3 批量隱藏選單項 document.querySelector('#hideMenuItems').onclick = function () { wx.hideMenuItems({ menuList: [ 'menuItem:readMode', // 閱讀模式 'menuItem:share:timeline', // 分享到朋友圈 'menuItem:copyUrl' // 複製連結 ], success: function (res) { alert('已隱藏“閱讀模式”，“分享到朋友圈”，“複製連結”等按鈕'); }, fail: function (res) { alert(JSON.stringify(res)); } }); }; // 8.4 批量顯示選單項 document.querySelector('#showMenuItems').onclick = function () { wx.showMenuItems({ menuList: [ 'menuItem:readMode', // 閱讀模式 'menuItem:share:timeline', // 分享到朋友圈 'menuItem:copyUrl' // 複製連結 ], success: function (res) { alert('已顯示“閱讀模式”，“分享到朋友圈”，“複製連結”等按鈕'); }, fail: function (res) { alert(JSON.stringify(res)); } }); }; // 8.5 隱藏所有非基本選單項 document.querySelector('#hideAllNonBaseMenuItem').onclick = function () { wx.hideAllNonBaseMenuItem({ success: function () { alert('已隱藏所有非基本選單項'); } }); }; // 8.6 顯示所有被隱藏的非基本選單項 document.querySelector('#showAllNonBaseMenuItem').onclick = function () { wx.showAllNonBaseMenuItem({ success: function () { alert('已顯示所有非基本選單項'); } }); }; // 8.7 關閉當前視窗 document.querySelector('#closeWindow').onclick = function () { wx.closeWindow(); }; // 8 介面操作介面結束------------------------------------------ // 9 微信原生介面開始--------------------- // 9.1.1 掃描二維碼並返回結果 document.querySelector('#scanQRCode0').onclick = function () { wx.scanQRCode(); }; // 9.1.2 掃描二維碼並返回結果 document.querySelector('#scanQRCode1').onclick = function () { wx.scanQRCode({ needResult: 1, desc: 'scanQRCode desc', success: function (res) { alert(JSON.stringify(res)); } }); }; // 9 微信原生介面結束--------------------- }); //初始化jsapi介面狀態 wx.error(function (res) { alert("呼叫微信jsapi返回的狀態:"+res.errMsg); });

微信掃一掃開發

微信公眾號開發紀要(4)-調用微信掃一掃功能

微信開發獲取Accesstoken和jsapi_ticket配置jssdk,呼叫微信掃一掃

微信網頁開發的一些感想，順便附上微信中呼叫掃一掃史上最簡便的方法 5行程式碼實現H5掃一掃 HTML5掃一掃最簡便的辦法

微信公眾號開發之調起微信掃一掃介面

微信公眾號開發--微信JS-SDK掃一掃功能

微信開發（微信掃一掃）商品建立

Android開發學習之基於ZBar實現微信掃一掃

微信JSSDK開發，呼叫微信掃一掃 JAVA & jsp前端 & js實現

微信掃一掃開發

ASP.NET MVC做的微信WEBAPP中調用微信JSSDK掃一掃

微信掃一掃，手機就能看遠程視頻監控直播

微信公眾號首頁掃一掃功能

jsapi微信掃一掃

微信公眾平臺：掃一掃demo

【.NET】.NET MVC4 微信掃一掃功能實現-附全部代碼

微信掃一掃打開網址彈出遮罩提示用戶在外部瀏覽器中打開

調用微信掃一掃功能，踩坑'invalid signature'

當在微信掃一掃進入小程序並獲取到二維碼的參數從而實現掃碼進入小程序

微信小程式在掃一掃進入小程式的時候安卓手機後臺繼續執行的常規處理

微信支付後臺介面開發(掃碼版)

微信掃一掃開發

相關推薦