1. 程式人生 > >微信js上傳圖片並 展示,iphone下預覽

微信js上傳圖片並 展示,iphone下預覽

https useragent 預覽圖 shang 服務器 fun 相冊 put 相機

    $(‘.addphotos‘).click(function(){
                    var that = $(this);
                    var ua = navigator.userAgent.toLowerCase();
                    var ios;
                    console.log(ua);
                    if (/iphone|ipad|ipod/.test(ua)) {
                        ios = true;
                    } 
else { ios = false; } console.log(ios); wx.chooseImage({ count: 1, // 默認9 sizeType: [‘original‘, ‘compressed‘], // 可以指定是原圖還是壓縮圖,默認二者都有 sourceType: [‘album‘, ‘camera‘], //
可以指定來源是相冊還是相機,默認二者都有 success: function (res) { var localIds = res.localIds; // 返回選定照片的本地ID列表,localId可以作為img標簽的src屬性顯示圖片 var localId = localIds[0]; wx.uploadImage({ localId: localIds[
0], // 需要上傳的圖片的本地ID,由chooseImage接口獲得 isShowProgressTips: 1, // 默認為1,顯示進度提示 success: function (res) { var serverId = res.serverId; // 返回圖片的服務器端ID var localData; if (ios || window.__wxjs_is_wkwebview) { wx.getLocalImgData({ localId: localId, success: function (res) { // var localData = res.localData; // localData是圖片的base64數據,可以用img標簽顯示 localData = res.localData.replace(‘jgp‘, ‘jpeg‘); var str = ‘<div class="shangchuan_img_xx">‘+ ‘<img class="zhaopian" src="‘+localData+‘"/>‘+ ‘<input type="hidden" name="photos[]" value="‘+serverId+‘">‘+ ‘<img class="xx_img" src="{MODULE_URL}static/img/xx.png"/>‘+ ‘</div>‘; that.before(str); }, fail: function (res) { alert(‘該圖片暫時無法查看‘) } }); } else { localData = localId; var str = ‘<div class="shangchuan_img_xx">‘+ ‘<img class="zhaopian" src="‘+localData+‘"/>‘+ ‘<input type="hidden" name="photos[]" value="‘+serverId+‘">‘+ ‘<img class="xx_img" src="{MODULE_URL}static/img/xx.png"/>‘+ ‘</div>‘; that.before(str); } } }); } }); });

iphone下不能使用localId來預覽圖片,需要使用微信jssdk最新版本https://res.wx.qq.com/open/js/jweixin-1.2.0.js wx.getLocalImgData接口來獲取圖片base64數據進行預覽

微信js上傳圖片並 展示,iphone下預覽