图片上传至服务器

前台html

<img style="display:none;" id="showImg" src="" />
<br />
<!--下面的隐藏域主要用来改变file类型的input的值,但是file类型的input的值出于安全考虑不让修改,但是表单提交后需要处理该值(放置图片路径)来显示服务器上的图片-->
<input type="hidden" id="img" name="uploadImg" />
请选择上传微信二维码收款图片:<input type="file" id="uploadImg" onchange="selectImg(this);" runat="server" />
View Code

JS

function selectImg(file) {
            if (!file.files || !file.files[0]) {
                return;
            }
            var reader = new FileReader();//读取文件
            reader.onload = function (event) {//文件读取完成的回调函数
                image = document.getElementById('showImg');
                $('#showImg').show();
                image.src = event.target.result;//读入文件的base64数据(可直接作为src属性来显示图片)
                //图片读取完成的回调函数(必须加上否则数据读入不完整导致出错!)
                image.onload = function () {
                    var formdata = new FormData();
                    formdata.append("file", $("#uploadImg")[0].files[0]);
                    $.ajax({
                        type: "post",
                        url: "/ashx/uploadImg.ashx",//返回图片路径
                        data: formdata,
                        cache: false,
                        contentType: false,
                        processData: false,
                        dataType: "json",
                        success: function (result) {
                            if (result.imgURL!= "" && result.error=="") {
                                alert("上传成功");
                                $('#img').val(result.imgURL);
                            }
                            else {
                                alert("上传失败,出现错误:" + result.error);
                            }
                        }
                    });
                }
            }
            //将文件已Data URL的形式读入页面
            reader.readAsDataURL(file.files[0]);
        }
View Code

后台Ashx

public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string name = "";
            string saveName = "";
            string error = "";
            try
            {
                HttpFileCollection _file = context.Request.Files;
                if (_file.Count > 0)
                {
                    //文件大小
                    long size = _file[0].ContentLength;
                    //文件类型
                    string type = _file[0].ContentType;
                    //文件名
                    //string name = _file[0].FileName;
                    name = _file[0].FileName;
                    //文件格式
                    string _tp = System.IO.Path.GetExtension(name);

                    if (_tp.ToLower() == ".jpg" || _tp.ToLower() == ".jpeg" || _tp.ToLower() == ".gif" || _tp.ToLower() == ".png" || _tp.ToLower() == ".swf")
                    {
                        //获取文件流
                        System.IO.Stream stream = _file[0].InputStream;
                        //保存文件
                        saveName = DateTime.Now.ToString("yyyyMMddhhmmss") + _tp;
                        byte[] bytes = new byte[stream.Length];
                        stream.Read(bytes, 0, bytes.Length);
                        // 设置当前流的位置为流的开始
                        stream.Seek(0, SeekOrigin.Begin);
                        using (FileStream fsWrite = new FileStream(@"C:\image\" + saveName, FileMode.Append))
                        {
                            fsWrite.Write(bytes, 0, bytes.Length);
                        };
                    }
                }
            }
            catch (Exception ex) {
                error = ex.ToString();
            }
            context.Response.Write("{\"imgURL\":\""+"C:\image\" + saveName + "\",\"error\":\""+ error + "\"}");
        }
View Code

 

由于业务原因删除了部分代码,此随笔仅供参考,可能尚有部分无用代码未删除干净,如有错误,欢迎指出

 

转载于:https://www.cnblogs.com/JediLK/p/9830466.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值