微信JSSDK chooseImage uploadImage 介面 在IOS與安卓的差異
首先得說明我用的JSSDK版本是1.1.0的,官方文件也是給出1.1.0的例子。
(目前查找了早期的跟新通知,已經知道了chooseImage在IOS下預覽無效的問題的原因)
//最新版本JSSDK文件
//https://mp.weixin.qq.com/advanced/wiki?t=t=resource/res_main&id=mp1421141115
/*
二:頁面通過LocalID預覽圖片
變化:1.2.0以下版本的JSSDK不再支援通過使用chooseImage api返回的localld以如:”img src=wxLocalResource://50114659201332”的方式預覽圖片。
適配建議:直接將JSSDK升級為1.2.0最新版本即可幫助頁面自動適配,但在部分場景下可能無效,此時可以使用
getLocalImgData 介面來直接獲取資料。
。(目前JSSDk線上版本是 1.0.0 和 1.1.0,更新版本為1.2.0 ,https://res.wx.qq.com/open/js/jweixin-1.2.0.js )
*/
獲取本地圖片介面
wx.getLocalImgData({
localId: '', // 圖片的localID
success: function (res) {
var localData = res.localData; // localData是圖片的base64資料,可以用img標籤顯示
}
});
備註:此介面僅在 iOS WKWebview 下提供,用於相容 iOS WKWebview 不支援 localId 直接顯示圖片的問題。具體可參考《iOS網頁開發適配指南》,
這意味著只有IOS8以上的手機才能用這個本地圖片介面,而以下的版本如果使用JSSDK1.2.0版本會導致無法獲取圖片資料,或者使用1.1.0又無法預覽圖片的尷尬場面,另外用了1.2.0版本後uploadImage會出現file not exists的錯誤
那麼,講講那些坑吧。
繼上次蘋果機 對JSON字串解析問題之後,目前又多了一個坑。
那就是在安卓上表現正常的兩個介面(選擇照片,上傳照片),在蘋果卻不行了。
相信大多數人在網上也找了很多資料,知道微信只允許一張一張的上傳和下載圖片,所以我們需要序列上傳
然而我在uploadImage的時候,是這樣寫的:
(虛擬碼,專案不在手上)
function upload(localIDS)//引數是選擇照片獲取的本地ID
{
cur=localIDS.pop();
wx.uploadImage({
localId: cur, // 需要上傳的圖片的本地ID,由chooseImage介面獲得
isShowProgressTips: 1, // 預設為1,顯示進度提示
success: function (res) {
var serverId = res.serverId; // 返回圖片的伺服器端ID
}
});
//我在uploadImage介面結束後判斷localIDS這個陣列是否還存在值
//如果還有則繼續呼叫
if(localIDS陣列還有值)
{
upload(localIDS);//原本這個應該是沒錯的,即使非同步上傳了我只是通過判斷在上傳圖片之前就已經改變的陣列是沒事的,所以安卓中的表
//現是正常的,然而在蘋果中,卻始終只上傳了最後一張照片,不管你是通過pop()還是shift()刪除陣列元素,反正就是最後一個數組元素。
//原因是 在IOS中,只有當你完全上傳完一張照片才能上傳第二張,所以得把這裡的判斷語句放進回撥函式success中,則安卓IOS正常
}
}
第二個問題,上傳的事情解決了以後,我發現chooseImage出現了問題,IOS中選擇照片後沒辦法預覽,在網上找到了一些解決方式,諸如匯入新版本的JSSDK(1.2.0,只要把原來的src 中1.1.0改成1.2.0就行),話說我很好奇,他們是哪裡看來的居然有這些版本,我表示壓根沒在開發文件有介紹。。。
方法主要有三個:
第一個方法(無效)
,通過判斷localids的內容把 wxlocalresource 替換為 wxLocalResource
結果我一看,IOS中的返回的localid的內容根本就不是wxlocalresource ,而是weixin://654678742這樣的字串,安卓的才是wxlocalresource ,所以排除掉這個答案
第二個方法:(無效)
通過一個叫getlocalimgdata 介面來預覽圖片,其用法與chooseImage一致,一般放在chooseImage的success回撥函式裡面,這裡需要做一些判斷,如果是蘋果手機則用getLocalimgdata返回的localdata顯示照片,如果是安卓則用原來chooseImage返回的本地照片陣列顯示照片,但很遺憾,我發現即使相容了IOS,和安卓的預覽圖片問題(實際上把JSSDK改成最新版本1.2.0,即使不用getlocalimgdata也已經可以預覽圖片了,問題是使用1.2.0後,uploadimage提示檔案不存在 file not exists ,那麼問題在於1.2.0之後uploadimage需要的localid到底是什麼?是原本的 wxLocalResource://xxxxx還是通過 getlocalimgdata返回的 包含 jpg和base64等開頭的資料,還是IOS原本的 weixin://xxxx呢?我測試過好像都不行,在IOS都提示檔案不存在)
第三個方法(有效,但是引起新的問題)
也就是我一開頭說的,JSSDK得1.2.0版本,該版本已經修復了這個問題,所以只要把檔案修改為1.2.0版本,在IOS就能正常預覽,但是其引發了新的問題:原本上傳檔案功能正常的卻無法上傳了,提示:
file not exist,檔案不存在,我能怎麼辦?我也很絕望啊,原封不動的程式碼就是改成了1.2.0版本的JSSDK檔案,所以我寧願無法預覽照片,也一定要上傳照片。 安卓功能一切正常,蘋果真的該淘汰了。又不好用,還各種版權,安全性總體上也不如安卓,也許有些人會說比安卓好一百倍一千倍,但那只是表象,曾經看過一篇文章,統計了很多資料分析,有興趣可以去找一下相關的資料,個人意見。