成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

微信JS-SDK選擇圖片遇到的坑

explorer_ddf / 1961人閱讀

摘要：微信選擇圖片遇到的坑有個需求要在微信企業(yè)號里面做開發(fā)，有個功能是選擇圖片，使用標(biāo)簽肯定是不管用了，手機(jī)上不能多選，所以使用了微信的提供的相關(guān)，這個地方真的是有坑，記錄一下。

微信JS-SDK選擇圖片遇到的坑

有個需求要在微信企業(yè)號里面做開發(fā)，有個功能是選擇圖片，使用input標(biāo)簽肯定是不管用了，Android手機(jī)上不能多選，所以使用了微信的JS-SDK提供的相關(guān)API，這個地方真的是有坑，記錄一下。按照文檔直接引入js文件即可，如果使用的是Vue，也可以使用weixin-js-sdk，兩種方式都可以。

圖片在Android上無法預(yù)覽

js-sdk的chooseImage 接口返回的結(jié)果是localId，類似于wxLocalResource://xxxxxx，如果想得到它的base64串需要再調(diào)用getLocalImgData方法，因?yàn)槲覀兒笈_接口里需要用到這個base64串，所以通過這個接口來獲取base64串作展示，而不是用文檔里介紹的方法。那這里有個坑，從Android獲取的localData是不帶有base64前綴的，要處理一下。

selectImage: function () {
    let context = this;
    wx.chooseImage({
        count: 9,
        sizeType: ["compressed"], 
        sourceType: ["album", "camera"], 
        defaultCameraMode: "normal", 
        success: function (res) {
            // localIds是在data里定義的一個localId數(shù)組
            context.localIds = res.localIds;
            // 不能直接遍歷這個數(shù)組
            context.updateBase64Data(context.localIds.shift());
        },
        fail: function (res) {
            alert("選擇圖片失敗:" + res.errMsg);
        },
    });
},
updateBase64Data: function (localId) {
    let context = this;
    wx.getLocalImgData({
        localId: localId, // 圖片的localID
        success: function (res) {
            let localData = res.localData;
            let prefix = "base64,";
            let index = localData.indexOf(prefix);
            let actData = localData;
            // 我現(xiàn)在是設(shè)置參數(shù)，如果是展示的話則應(yīng)該是添加頭部data:image/jpeg;base64,
            if (index > -1) {
                actData = localData.substring(index + 7);
            }
            // base64Array是在data里定義的一個base64串?dāng)?shù)組
            context.base64Array.push(actData);
            
            if (context.localIds.length > 0) {
                context.updateBase64Data(context.loaclIds.shift());
            } else {
                // 執(zhí)行處理
            }
        },
        fail: function (res) {
            alert("選擇圖片失敗:" + res.errMsg);
        },
    });
},
getLocalImgData獲取多張圖片無響應(yīng)

chooseImage方法獲取到是一個localId的數(shù)組，如果直接遍歷這個數(shù)組去調(diào)用getLocalImgData時它只會執(zhí)行一次，后面的無論怎樣都不會執(zhí)行，猜測應(yīng)該是跟它localId的獲取有關(guān)系。所以采取了上面代碼中遞歸的方式調(diào)用，當(dāng)連續(xù)調(diào)用uploadImage上傳圖片時也要這么做。

Android無法選擇原圖

盡管在chooseImage方法可以通過sourceType字段指定是原圖還是壓縮后的圖，但是只要調(diào)用了getLocalImgData方法，那獲取到的base64串展示一定是模糊的。你在想是不是Android上面不能使用原圖啊，錯了，仔細(xì)看IOS上面的圖也是不清楚的，測試發(fā)現(xiàn)確實(shí)是這樣，原圖1.8M，使用js-sdk選擇的原圖只有不到240K，那為什么Android會模糊但是IOS比較清楚呢，你是不是又想這不是IOS和Android系統(tǒng)的區(qū)別吧，把同一張圖片通過getLocalImgData方法獲取到的base64串做比對發(fā)現(xiàn)，Android上得到的base64串前綴是以gCM開頭，而IOS則是以/9j/開頭，從PC上選擇的圖也是以/9j/開頭，自己解析的圖片也是以/9j/開頭，所以不是因?yàn)閴嚎s變模糊了，是因?yàn)槭褂昧瞬灰粯拥木幋a變模糊了。如果真的想選擇原圖，先把圖片上傳到微信服務(wù)器，然后使用獲取臨時素材的接口https://qyapi.weixin.qq.com/cgi-bin/media/get?access_token=ACCESS_TOKEN&media_id=MEDIA_ID，把圖片下載下來，經(jīng)測試這樣其實(shí)也是有壓縮的，這個是企業(yè)號的API如果用公眾號地址是https://api.weixin.qq.com/cgi-bin/media/get?access_token=ACCESS_TOKEN&media_id=MEDIA_ID。代碼就不貼了，與上面的基本一致。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/108197.html

相關(guān)文章

  • vue項(xiàng)目接入微信JSSDK的坑

    摘要：微信說明文檔分享的坑根據(jù)的文檔，很多人都是在初始化的配置的時候，傳入的當(dāng)前的地址不正確。同樣的，給微信初始化的加入對應(yīng)的參數(shù)。 date: 2018-12-13 15:23:09 用于記錄接入微信JS-SDK的坑，以后方便查詢第一次接入公眾號微信支付、分享、定位等等的坑的時候，心里是迷茫而又恐懼。因?yàn)椋犝f坑特別多，后來發(fā)現(xiàn)自己的親身體驗(yàn)到了這一點(diǎn)。 支付的坑 1、當(dāng)前URL未注冊 ...

    lieeps 評論0 收藏0

  • vue項(xiàng)目接入微信JSSDK的坑

    摘要：微信說明文檔分享的坑根據(jù)的文檔，很多人都是在初始化的配置的時候，傳入的當(dāng)前的地址不正確。同樣的，給微信初始化的加入對應(yīng)的參數(shù)。 date: 2018-12-13 15:23:09 用于記錄接入微信JS-SDK的坑，以后方便查詢第一次接入公眾號微信支付、分享、定位等等的坑的時候，心里是迷茫而又恐懼。因?yàn)?，聽說坑特別多，后來發(fā)現(xiàn)自己的親身體驗(yàn)到了這一點(diǎn)。 支付的坑 1、當(dāng)前URL未注冊 ...

    jsdt 評論0 收藏0

  • vue項(xiàng)目接入微信JSSDK的坑

    摘要：微信說明文檔分享的坑根據(jù)的文檔，很多人都是在初始化的配置的時候，傳入的當(dāng)前的地址不正確。同樣的，給微信初始化的加入對應(yīng)的參數(shù)。 date: 2018-12-13 15:23:09 用于記錄接入微信JS-SDK的坑，以后方便查詢第一次接入公眾號微信支付、分享、定位等等的坑的時候，心里是迷茫而又恐懼。因?yàn)?，聽說坑特別多，后來發(fā)現(xiàn)自己的親身體驗(yàn)到了這一點(diǎn)。 支付的坑 1、當(dāng)前URL未注冊 ...

    nodejh 評論0 收藏0

  • 微信公眾號頁面(VUE)中如何配置微信JS-SDK和高德地圖,以及遇到的一些問題記錄

    摘要：安裝并引入依賴包這里是說明文檔下載依賴包在需要用到的模塊引入檢查是否引入成功可以在引入的模塊中執(zhí)行控制臺顯示以上代碼表示引入成功配置微信所有需要使用的頁面必須先注入配置信息，否則將無法調(diào)用開啟調(diào)試模式調(diào)用的所有的返回值會 1.安裝并引入JS-SDK依賴包 這里是JS-SDK說明文檔 1.1 npm 下載依賴包 npm install weixin-js-sdk --save 1.2.在...

    Joyven 評論0 收藏0

  • node調(diào)用微信JS SDK遇到的坑

    摘要：廢話不多說來說說用做服務(wù)端調(diào)用微信遇到的坑。微信都有說明不做贅述。因?yàn)橐院笪⑿欧祷氐闹挡艜淖?，并且微信?guī)定每天限定的訪問次數(shù)如果使用庫的話優(yōu)勢可以減少對微信服務(wù)器訪問的次數(shù)提升性能。 這幾天要做一個H5的頁面，之前沒做。對我來說也是一次對新領(lǐng)域的接觸。廢話不多說來說說用node做服務(wù)端調(diào)用微信JS SDK遇到的坑。首先講一下思路： 微信JS-SDK說明文檔 綁定域名 引入JS文件 ...

    Godtoy 評論0 收藏0

發(fā)表評論

0條評論

explorer_ddf

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<