js图片上传

html结构

 <input  type="file"  id="m_ImgSrc" />        
 <img src="#" id="Preview" />

显示图片

 $("#m_ImgSrc").change(function () {
                var obj = $("#m_ImgSrc")[0].files[0];
                if (!/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(obj.name)) {
                    alert("请选择图片");
                    return;
                }
                var fr = new FileReader();
                fr.onload = function () {
                    $("#Preview").attr('src', fr.result);
                    $("#Preview").show();
                };
                fr.readAsDataURL(obj);
            });

js上传

 var formData = new FormData();
                formData.append("file", obj);
                $.ajax({
                    url: "UploadFile.ashx?p=Img",
                    type: "POST",
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function (data) {
                    }
                });

后台部分(c#)

 public class UploadFile : IHttpHandler, IRequiresSessionState
    {
        private HttpContext context;
        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            //指定文件保存目录
            string getPath = context.Request.QueryString["p"];
            //文件保存目录路径
            string savePath = "/Picture/" + getPath + "/";
            //文件保存目录URL
            string saveUrl = "http://" + context.Request.Url.Authority + "/Picture/" + getPath + "/";
            //定义允许上传的文件扩展名
            Hashtable extTable = new Hashtable();
            extTable.Add("image", "gif,jpg,jpeg,png,bmp");
            extTable.Add("flash", "swf,flv");
            extTable.Add("media", "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");
            extTable.Add("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2,css");
            //最大文件大小
            int maxSize = 1000000;
            this.context = context;

            HttpPostedFile imgFile = context.Request.Files["file"];

            if (imgFile == null)
            {
                showError("请选择文件。");
            }

            string dirPath = context.Server.MapPath(savePath);

            if (!Directory.Exists(dirPath))
            {
                Directory.CreateDirectory(dirPath);
            }

            string dirName = context.Request.QueryString["dir"];

            if (string.IsNullOrEmpty(dirName))
            {
                dirName = "image";
            }

            if (!extTable.ContainsKey(dirName))
            {
                showError("目录名不正确。");
            }

            string fileName = imgFile.FileName;
            string fileExt = Path.GetExtension(fileName).ToLower();

            if (imgFile.InputStream == null || imgFile.InputStream.Length > maxSize)
            {
                showError("上传文件大小超过限制。");
            }

            if (string.IsNullOrEmpty(fileExt) || Array.IndexOf(((string)extTable[dirName]).Split(','), fileExt.Substring(1).ToLower()) == -1)
            {
                showError("上传文件扩展名是不允许的扩展名。\n只允许" + ((string)extTable[dirName]) + "格式。");
            }

            //创建文件夹
            dirPath += dirName + "/";
            saveUrl += dirName + "/";

            if (!Directory.Exists(dirPath))
            {
                Directory.CreateDirectory(dirPath);
            }

            string ymdStr = DateTime.Now.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo);
            dirPath += ymdStr + "/";
            saveUrl += ymdStr + "/";

            if (!Directory.Exists(dirPath))
            {
                Directory.CreateDirectory(dirPath);
            }

            string newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;
            string filePath = dirPath + newFileName;

            imgFile.SaveAs(filePath);

            string fileUrl = saveUrl + newFileName;

            Hashtable hashMsg = new Hashtable();
            hashMsg["error"] = 0;
            hashMsg["url"] = fileUrl;

            context.Response.AddHeader("Content-Type", "text/html; charset=UTF-8");

			//转相对路径
			if (!string.IsNullOrEmpty(context.Request["relative"])) {
				var relativeUrl= hashMsg["url"].ToString().Substring(0, hashMsg["url"].ToString().IndexOf("Picture"));
				hashMsg["url"] = hashMsg["url"].ToString().Replace(relativeUrl,"../../../");
			}

            context.Response.Write(JsonMapper.ToJson(hashMsg));
            context.Response.End();
        }

        private void showError(string messageStr)
        {
            Hashtable hashMsg = new Hashtable();
            hashMsg["error"] = 1;
            hashMsg["message"] = messageStr;
            context.Response.AddHeader("Content-Type", "text/html; charset=UTF-8");
            context.Response.Write(JsonMapper.ToJson(hashMsg));
            context.Response.End();
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值