mui 上传图片

摘要:
函数(e){if(mui.os.plus){varbuttonTit=[{title://Takingpictures函数getImage(){varc=plus.cacamer.getCamera();函数{console.log(“error”+s);函数(){plus.nativeUI.alert('最多只能选择5张图片');

mui前端传输文件

//上传图片
            document.getElementById('photo').addEventListener('tap', function(e) {
                if (mui.os.plus) {
                    var buttonTit = [{
                        title: "拍照"
                    }, {
                        title: "从手机相册选择"
                    }];
            
                    plus.nativeUI.actionSheet({
                        title: "上传图片",
                        cancel: "取消",
                        buttons: buttonTit
                    }, function(b) { /*actionSheet 按钮点击事件*/
                        switch (b.index) {
                            case 0:
                                break;
                            case 1:
                                getImage(); /*拍照*/
                                break;
                            case 2:
                                galleryImg(); /*打开相册*/
                                break;
                            default:
                                break;
                        }
                    })
                }
            });
            // 拍照获取图片
            function getImage() {
                var c = plus.camera.getCamera();
                c.captureImage(function(e) {
                    plus.io.resolveLocalFileSystemURL(e, function(entry) {
                        var imgSrc = entry.toLocalURL() + "?version=" + new Date().getTime(); //拿到图片路径                        
                        setHtml(imgSrc);
                        var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径 
                        newUrlAfterCompress = compressImage(imgSrc, dstname);
                        appendFile(dstname, imgSrc);
                    }, function(e) {
                        console.log("读取拍照文件错误:" + e.message);
                    });
                }, function(s) {
                    console.log("error" + s);
                }, {
                    filename: "_doc/camera/"
                })
            }
            // 从相册中选择图片 
            function galleryImg() {
                plus.gallery.pick(function(e) {
                    for (var i in e.files) {
                        var fileSrc = e.files[i];
                        setHtml(fileSrc);
                        var dstname = "_downloads/" + getUid() + ".jpg"; //设置压缩后图片的路径 
                        newUrlAfterCompress = compressImage(e.files[i], dstname);
                        appendFile(dstname, fileSrc);
                    }
                }, function(e) {
                    console.log("取消选择图片");
                }, {
                    filter: "image",
                    multiple: true,
                    maximum: 5,
                    system: false,
                    onmaxed: function() {
                        plus.nativeUI.alert('最多只能选择5张图片');
                    }
                });
            }
            
            function setHtml(e) {
                var divHtml = "<div class="a-add"><img src="http://t.zoukankan.com/ + encodeURI(e) +
                    "   style="96px;height:96px"><img  src="http://t.zoukankan.com/images/remove.png" class="a-remove"></div>";
                $("#imgDiv").prepend(divHtml);
            }
            //压缩图片,这个比较变态的方法,无法return 
            function compressImage(src, dstname) {
                plus.zip.compressImage({
                        src: src,
                        dst: dstname,
                        overwrite: true,
                        quality: 20
                    },
                    function(event) {
                        return event.target;
                    },
                    function(error) {
                        console.log(error);
                        return src;
                    });
            }
            // 产生一个随机数 
            function getUid() {
                return Math.floor(Math.random() * 100000000 + 10000000).toString();
            }

var files = [];
var index = 1;
var newUrlAfterCompress;

function appendFile(p, fileSrc) {
files.push({
name: "img" + index, //这个值服务器会用到,作为file的key
path: p,
fileSrc: fileSrc
});
index++;
}

//上传文件
            function upload() {
                var url = ServerIp + "/api/upload/upload";
                var task = plus.uploader.createUpload(url, {
                        method: "POST"
                    },
                    function(t, status) {
                        if (status == 200) {
                            $("#imgDiv").find(".a-add").remove();
                            files = [];
                            index = 1;
                        } else {
                            files = [];
                        }
                    }
                );
                //添加其他参数
                for (var i = 0; i < files.length; i++) {
                    var f = files[i];
                    task.addFile(f.path, {
                        key: f.name
                    });
                }
                task.addData("business_id", confirm_id);
                task.addData("business_type", "整改确认");
                task.addData("item_id", _localStorage.getItem("record_id")); //记录表id
                task.addData("file_type", 1);
                task.addData("create_user", localStorage.getItem("realName"));
                task.start();
            }

后台接口设置

[Route("upload"), HttpPost]
        public IHttpActionResult Upload()
        {
            bool result = false;
            int count = HttpContext.Current.Request.Files.Count;
            string filename = "";
            string compressname = "";
            try
            {
                for (int i = 0; i < count; i++)
                {
                    int l = HttpContext.Current.Request.Files["img" + (i + 1)].ContentLength;
                    byte[] buffer = new byte[l];
                    Stream s = HttpContext.Current.Request.Files["img" + (i + 1)].InputStream;
                    //System.Drawing.Bitmap image = new System.Drawing.Bitmap(s);
                    string imgname = Guid.NewGuid().ToString() + ".png";
                    string comname = Guid.NewGuid().ToString();
                    AliyunOSS.PutObject(bucketName, "不符合项/" + imgname, s);
                    // string path = "/UploadFile/upload/";
                    // string webPath = ConfigurationManager.AppSettings["UploadPath"].ToString(); //web下的绝对路径
                    //  filename = path + imgname + ".png";//大图相对路径及名字
                    // compressname = path + comname + ".png";//小图相对路径及名字
                    // string savePath = webPath + path + imgname + ".png";
                    // string comsavePath = webPath + path + comname + ".png";
                    //大图
                    //var bitImage = GetThumbnailImage(image, image.Width, image.Height);
                    //bitImage.Save(savePath, System.Drawing.Imaging.ImageFormat.Png);//保存
                    //小图
                    // var combitImage = GetThumbnailImage(image, 69, 69);
                    // combitImage.Save(comsavePath, System.Drawing.Imaging.ImageFormat.Png);//保存
                    #region 记录表
                    im_file file = new im_file();
                    file.id = Guid.NewGuid().ToString();
                    file.business_id = HttpContext.Current.Request.Form["business_id"];
                    file.business_type = HttpContext.Current.Request.Form["business_type"];
                    file.item_id = HttpContext.Current.Request.Form["item_id"];
                    // file.file_name = imgname + ".png";
                    file.file_name = "不符合项/" + imgname;
                    file.file_path = filename;
                    file.compressedfile_path = compressname;
                    file.file_type = 1;
                    file.create_user = HttpContext.Current.Request.Form["create_user"];
                    file.create_date = DateTime.Now;
                    _fileRepository.Insert(file);
                    #endregion
                    result = true;
                }
            }
            catch (Exception e)
            {
                result = false;
            }
            return Ok(result);
        }

        //图片压缩
        public static Image GetThumbnailImage(Image srcImage, int width, int height)
        {
            Image bitmap = new Bitmap(width, height);
            Graphics g = Graphics.FromImage(bitmap);
            //设置高质量插值法 
            g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High;
            g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighSpeed;
            //在指定位置并且按指定大小绘制原图片的指定部分 
            g.DrawImage(srcImage, new Rectangle(0, 0, width, width),
                new Rectangle(0, 0, srcImage.Width, srcImage.Height),
                GraphicsUnit.Pixel);
            return bitmap;
        }

免责声明:文章转载自《mui 上传图片》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇/etc/pam.d 与 /etc/security 密码策略spring mvc出现 Failed to convert property value of type 'java.lang.String' to required type 'java.util.Date' for property 'endtime'下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

vue实现简单日历

1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>日历</title> 7 <style> 8 * {...

ag-grid实时监测复选框变化

监测复选框变化  1.最终效果:     点击复选框,页面显示已选中多少条          2. 实现步骤:     1. 在ag-grid中添加: @selection-changed="onSelectionChanged" <ag-grid-vue class="table ag-theme-b...

图片选择器

注释比较少。。。直接贴代码吧,主要有popupWindow的实现,然后通过ContentResolver便利自己手机里的所有图片,直接贴代码吧 主Activity的实现 public class MainActivity extends Activity { private GridView id_gridView; private T...

通过命令行查看当前android系统的版本

由于开发的时候只有板子没有电视,突然向通过命令来查看板子的andorid系统版本,发现还真没有神马命令能够直接将android版本给输出来的。 最后经过度娘的指点才发现getprop可以返回Android的所有系统属性,顿时眼前一亮,经过仔细查找终于找到了getprop中字段"[ro.build.version.release]: [2.2]" (andr...

转:Android设置全局变量

声明:本文转自feiyangxiaomi的博客:http://blog.csdn.net/feiyangxiaomi/article/details/9966215仅供学习使用,转载请指明原作者。 文中介绍了两种在Android中使用全局变量的方法,其中第一中是android推荐的,但是只能用于继承Activity类使用,第二种是java中设置静态变量和方...

禁止、允许MySQL root用户远程访问权限

禁止:1、进入mysql; 2、 mysql> use mysql; 3、执行修改权限语句(禁用); mysql> update user set host = "localhost" where user = "root" and host = "%"; 4、刷新权限; mysql> plush privileges;   启用: 1、...