zoukankan      html  css  js  c++  java
  • 微信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标签显示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.3.0.js wx.getLocalImgData接口来获取图片base64数据进行预览

  • 相关阅读:
    用R作Polar图等
    R语言绘制空间热力图
    Spark 基础及RDD基本操作
    Bars, rectangles with bases on x-axis
    spark dataframe操作集锦(提取前几行,合并,入库等)
    【R】用 ggplot2 绘制漂亮的分级统计地图
    Rattle:数据挖掘的界面化操作
    R语言进阶之4:数据整形(reshape)
    ggplot2——简介
    python复习冒泡排序
  • 原文地址:https://www.cnblogs.com/benlightning/p/7657827.html
Copyright © 2011-2022 走看看