頻道欄目
首頁 > 微信學院 > 微信公眾平臺開發 > 正文

微信公眾平臺使用JSSDK網頁調起掃碼并獲取掃碼數據(PHP實現)

2017-12-06 10:58:11         來源:slm311的專欄  
收藏   我要投稿

微信公眾平臺使用JSSDK網頁調起掃碼并獲取掃碼數據

初學者,部分css樣式在網上扒下來的,功能實現了,代碼很糙,非常糙,望海涵,也希望大神多指導

得到你的APPID與AppSecret 獲取到access_token與ticket 配置wx.config 調用掃碼 二維碼與條形碼處理 獲取返回值 關于蘋果端網頁掃碼調起的問題處理 最后


廢話不多說直接上代碼:

<!--?php
require_once "jssdk.php";
$jssdk = new JSSDK("你的ADPPID", "你的AppSecret");
$signPackage = $jssdk--->GetSignPackage();
//sample.php,獲取你的APPID與AppSecret傳遞到JSSDK處理
?>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><!-- 適應屏幕縮放等亂七八糟的-->
<meta name="format-detection" content="telephone=no, email=no">
<title>這是標題啊</title>
<script src="vp.js" charset="utf-8"></script>
<link rel="stylesheet" href="swiper.min.css" media="screen" charset="utf-8">
<link rel="stylesheet" href="queryExp.css" media="screen" charset="utf-8">
 
 
        <header class="page-title">
         
        <h1 class="title">這是名字啊</h1>
    </header>
    <section class="form-main">
        <!--<input id="waybillNoId" type="button" value="請輸入要查詢的單號" onclick="window.location.href='history.html?from=query'">-->
        <input id="waybillNoId" type="button" value="請輸入要查詢的單號" onclick="">
        <i id="query" class="scan"></i>  <!-- 這里是點擊那個掃碼的圖片-->
    </section>
       <script src="jweixin-1.0.0.js"></script>
        <script type="text/javascript" src="jquery.js"></script> 
        <script type="text/javascript">
<!-- 這里寫wx.config和wx.scanQRCode-->
      wx.config({//配置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: [
      //要調用的接口全部寫在這
        'checkJsApi',
        'onMenuShareTimeline',
        'onMenuShareAppMessage',
        'onMenuShareQQ',
        'onMenuShareWeibo',
        'hideMenuItems',
        'showMenuItems',
        'hideAllNonBaseMenuItem',
        'showAllNonBaseMenuItem',
        'translateVoice',
        'startRecord',
        'stopRecord',
        'onRecordEnd',
        'playVoice',
        'pauseVoice',
        'stopVoice',
        'uploadVoice',
        'downloadVoice',
        'chooseImage',
        'previewImage',
        'uploadImage',
        'downloadImage',
        'getNetworkType',
        'openLocation',
        'getLocation',
        'hideOptionMenu',
        'showOptionMenu',
        'closeWindow',
        'scanQRCode',
        'chooseWXPay',
        'openProductSpecificView',
        'addCard',
        'chooseCard',
        'openCard'
      ]
 
  });
 wx.ready(function () {
    document.querySelector('#query').onclick = function () {//調用掃碼事件返回掃碼值
    wx.scanQRCode({
      needResult: 1,
      desc: 'scanQRCode desc',
      success: function (res) {
      alert(res.resultStr)//掃碼數據在這看
        }         
      }
    });
  };   
});
 
       </script>

實際操作發現當掃描二維碼的時候沒有什么問題,但是掃碼掃到條碼時會出現問題,下面貼上處理方法:

if(res.resultStr.indexOf(',') > 0){
 //條形碼時返回的格式類似為【code128,123456789】      
     var dealserialNumber=res.resultStr.split(',')[1];          
     dealserialNumber = dealserialNumber.replace(/[^a-z\d]/ig, "");//處理條形碼掃描的字符
     location.href='接收結果頁面='+dealserialNumber;//掃描結果傳遞到的處理頁面
else{
//二維碼時
location.href='接收結果頁面='+res.resultStr;//掃描結果傳遞到的處理頁面
}

關于蘋果端掃碼,查了下往上,說什么網絡請求之類的話,要怎么怎么處理,我處理起來比較粗暴,所有的js文件本地化,不知道是不是可行的,但是測試沒發現什么大的問題,不知道這樣處理是不是正確。

上一篇:微信公眾號開發步驟(縮減版)
下一篇:微信公眾號創建二維碼ticket的2種方式講解
相關文章
圖文推薦
熱門新聞

關于我們 | 聯系我們 | 廣告服務 | 投資合作 | 版權申明 | 在線幫助 | 網站地圖 | 作品發布 | Vip技術培訓 | 舉報中心

版權所有: 紅黑聯盟--致力于做實用的IT技術學習網站

加拿大28火车判定方法