webAPP 图片上传

关于webAPP 手机上传

用的vue.js

首先是js代码

调用手机app 的 相册或者自己拍照

upload: function(index) { //上传
                        this.index = index
                        //显示菜单
                        mui('#sheet').popover('toggle');
                    },
                    camera: function() { //拍照
                        var that = this;
                        //显示菜单
                        mui('#sheet').popover('toggle');
                        plus.camera.getCamera().captureImage(function(path) { //成功
                            uploadSvc.upImage(path, function(data) {
                                data=JSON.parse(data);
                                if(data.Result.Id && data.Result.Url) {
                                    that.formData.Paras[that.index].DefaultVal = data.Result.Id;
                                    that.formData.Paras[that.index].FileUrl = data.Result.Url;
                                }
                            });
                        })
                    },
                    gallery: function() { //相册选择
                        var that = this;
                        //显示菜单
                        mui('#sheet').popover('toggle');
                        plus.gallery.pick(function(path) { //成功
                            uploadSvc.upImage(path, function(data) {
                                data=JSON.parse(data);
                                if(data.Result.Id && data.Result.Url) {
                                    that.formData.Paras[that.index].DefaultVal = data.Result.Id;
                                    that.formData.Paras[that.index].FileUrl = data.Result.Url;
                                }
                            });
                        }, function(e) { //失败
                            console.log("取消选择图片");
                        }, {
                            filter: "image",
                            maximum: 1,
                            multiple: false
                        })
                    }

//上传图片
    _self.upImage = function(path,callback){
        var serverUrl=systemSvc.resolveUrl('api_v1/UpFileApi/UploadImg');

        var wt=plus.nativeUI.showWaiting();
        //开始上传任务
        var task=plus.uploader.createUpload(serverUrl,{
            method:'post',
            timeout:15000,
            blocksize:0
        },function(t,s){
            console.log(JSON.stringify(t));
            console.log(s);
            if (s==200) {
                callback(t.responseText)
                mui.toast("上传成功");
            }else{
                mui.toast("上传失败");
            }
            wt.close();
        });
        task.addFile(path,{key:"file"});
        task.start();
    };

后台接收坑挺多的， 踩了一上午

 var request = HttpContext.Current.Request;
             //文件流
             var stream = request.Files["file"].InputStream;
             //文件类型
             var mime = request.Files["file"].ContentType;
             //保存为byte数组
             byte[] imgBytes =new byte[stream.Length];
             stream.Read(imgBytes, , imgBytes.Length);
             stream.Seek(, SeekOrigin.Begin);

后台接收图片

如果用这个获取字节流

var data = Request.Content.ReadAsByteArrayAsync();

获取的是所有的数据的 字节流 不只有图片数据的字节流    还有你的一些参数的字节流

然后转换成图片的时候是没用的