調用微信拍照和選擇圖片功能

任務需求背景：購買商品，下單完成之后要實名驗證，再安排發貨

1.遇到的問題,每當遇到需要在微信工具才能打開的網頁,思考

MobilePage

class History_EweiShopV2Page extends MobileLoginPage 這個是要經過微信授權的
2.利用微信圖片上傳功能
微信調用拍照和選擇圖片功能 
微信JS-SDK說明文檔
在域名驗證,授權成功的基礎上
遇到的問題.當你在微信工具調用時出現chooseImage:fail, the permission value is offline verifying

說明jsApiList js接口列表沒有chooseImage

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

});
實例:單張圖片上傳並成功顯示(條件已經授權成功並調用)
拍照上傳查看

<div class='fui-cell'>
   <div class='fui-cell-label'>身份證正面:</div>
   <div class="row" >
      <input id="identify_img_input"  name="identify_img_input" type="hidden">
      <div class="col-md-6"> <button type="button" class="btn  block camera" onclick="upload('identify_img')">上傳照片</button></div>
      <div class="col-md-6"><img onclick="previewImage('identify_img')" id="identify_img" src="" alt="" width="60px" height="60px"/></div>

   </div>

</div>

 

function upload(data) {

       $var_img = data;//selertor
           $var_input = $('#'+data+'_input'); //圖片值 identify_img2_input

            wx.chooseImage({
                count: 1, // 默認9
                sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖，默認二者都有
                sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機，默認二者都有
                success: function (res) {
                    //images.localId = res.localIds;
                    localIds = res.localIds;  // 返回選定照片的本地ID列表，localId可以作為img標簽的src屬性顯示圖片
                    document.getElementById($var_img).src = localIds;   //選擇的圖片 顯示
                    //必須做一下mediaId的設定，否則將會無法在安卓端得到微信上傳功能的觸發
                    localId = localIds.toString();
                  //在成功選擇圖片或拍照的時候 可以觸發上傳圖片, 16                     wx.uploadImage({
                        localId: localId, // 需要上傳的圖片的本地ID，由chooseImage接口獲得
                        isShowProgressTips: 1, // 默認為1，顯示進度提示
                         
                        success: function (res) {
                            var serverId = res.serverId; // 返回圖片的服務器端ID 4HY4_D5p8ZcBIeVPKUIkvWBd7OlNr_f2TVPAs32xnb5oZQDugO1qPYoz-7Jpc095

//當成功從微信服務端返回 serverid 上傳到php自己服務器上  23  $.ajax({ 24 url:"{php echo mobileUrl('member/info/getmedia')}", 25 type:'post', 26  data:{ 27  media_id:serverId, 28  }, 29 dataType:'json', 30 success:function(data){ 31 if (data.error == 1) { 32  alert(data.message); 33 } else { 34 35 $($var_input).val(data.realimgurl); //圖片顯示在前端<img>  36  } 37  }, 38 error: function(request) { 39 alert("Connection error");//make-in-lemon 正式發行可選擇屏蔽 40  }, 41  }); 42 43  }, 44 fail:function(res){ 45  alert(res.errMsg); 46 // alert(JSON.stringify(res)) 47  } 48  }); 49 50  } 51  }); 52 }

php服務端 上傳圖片代碼

public function getmedia()
    {
        global $_W, $_GPC;
        //$access_token = WeAccount::token();
        $media_id = $_GPC['media_id'];//4HY4_D5p8ZcBIeVPKUIkvWBd7OlNr_f2TVPAs32xnb5oZQDugO1qPYoz-7Jpc095

        $media_id = '4HY4_D5p8ZcBIeVPKUIkvWBd7OlNr_f2TVPAs32xnb5oZQDugO1qPYoz-7Jpc095';
        $access_token = "8HB-zIqVZK_VB08WJFFXGNohsVknCalzlkTXeLGQSCb9x654gI1_oO95Jzd7KYbS2urNtIv6e-y6IYObjKINbwzkdbZNUSrbciYsHljqXYSiU_P6D_0WHPJm5JHu4XeMONJeABASRN";
        $url = "http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=" . $access_token . "&media_id=" . $media_id;
        $updir = "../attachment/images/" . $_W['uniacid'] . "/" . date("Y", time()) . "/" . date("m", time()) . "/";
        if (!file_exists($updir)) {
            mkdir($updir, 511, true);//創建一個目錄
        }
        $randimgurl = "images/" . $_W['uniacid'] . "/" . date("Y", time()) . "/" . date("m", time()) . "/" . date('YmdHis') . rand(1000, 9999) . '.jpg';
        $targetName = "../attachment/" . $randimgurl;
        $ch = curl_init($url);
        $fp = fopen($targetName, 'wb');
        curl_setopt($ch, CURLOPT_FILE, $fp);
        curl_setopt($ch, CURLOPT_HEADER, 0);
        curl_exec($ch);
        curl_close($ch);
        fclose($fp);
        if (file_exists($targetName)) {
            $resarr['error'] = 0;
            $this->mkThumbnail($targetName, 640, 0, $targetName);
            if (!empty($_W['setting']['remote']['type'])) {
                load()->func('file');
                $remotestatus = file_remote_upload($randimgurl, true);
                if (is_error($remotestatus)) {
                    $resarr['error'] = 1;
                    $resarr['message'] = '遠程附件上傳失敗，請檢查配置並重新上傳';
                    file_delete($randimgurl);
                    die(json_encode($resarr));
                } else {
                    file_delete($randimgurl);
                    $resarr['realimgurl'] = $randimgurl;
                    $resarr['imgurl'] = tomedia($randimgurl);
                    $resarr['message'] = '上傳成功';
                    die(json_encode($resarr));
                }
            }
            $resarr['realimgurl'] = $randimgurl;
            $resarr['imgurl'] = tomedia($randimgurl);
            $resarr['message'] = '上傳成功';
        } else {
            $resarr['error'] = 1;
            $resarr['message'] = '上傳失敗';
        }
        echo json_encode($resarr, true);
        die;
    }