微信js上传图片并 展示,iphone下预览
Posted 学不断,思还乱
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信js上传图片并 展示,iphone下预览相关的知识,希望对你有一定的参考价值。
$(‘.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下预览的主要内容,如果未能解决你的问题,请参考以下文章
js-jssdk微信H5选择多张图片预览并上传(兼容ios,安卓,已测试)