Detailed explanation of form upload implementation ajax file asynchronous upload

User uploads are always indispensable in projects. Here are the main list of form uploads and ajax uploads! Note: context.Request.Files is not suitable for operating large files. The following is mainly for processing small file uploads! This article mainly introduces the form upload function and file upload function implementation in detail. Ajax file asynchronous upload has certain reference value. Interested friends can refer to it. I hope it can help everyone.

Resource download:

1. jQuery official download address: https://jquery.com/download/

1. Form upload:

html Client part:

    选择文件:

    
  

General handler server side:

public void ProcessRequest(HttpContext context)
    {
      context.Response.ContentType = "text/plain";
      HttpPostedFile file1 = context.Request.Files["file1"];
      helper.uploadFile(file1, "~/upload/");//这里就是对相应方法进行调用
      context.Response.Write("ok");//提示执行成功
    }

Encapsulation of upload code:

/// 

    /// 上传图片
    /// 
    /// 通过form表达提交的文件
    /// 文件要保存的虚拟路径
    public static void uploadImg(HttpPostedFile file,string virpath)
    {     
      if (file.ContentLength > 1024 * 1024 * 4)
      {
        throw new Exception("文件不能大于4M");
      }
      string imgtype = Path.GetExtension(file.FileName);
      if(imgtype!=".jpg"&&imgtype!=".jpeg") //图片类型进行限制
      {
        throw new Exception("请上传jpg或JPEG图片");
      }
      using (Image img = Bitmap.FromStream(file.InputStream))
      {
        string savepath = HttpContext.Current.Server.MapPath(virpath+file.FileName);
        img.Save(savepath);
      }
    }
    /// 

    /// 上传文件
    /// 
    /// 通过form表达提交的文件
    /// 文件要保存的虚拟路径
    public static void uploadFile(HttpPostedFile file, string virpath)
    {
      if (file.ContentLength > 1024 * 1024 * 6)
      {
        throw new Exception("文件不能大于6M");
      }
      string imgtype = Path.GetExtension(file.FileName);
      //imgtype对上传的文件进行限制
      if (imgtype != ".zip" && imgtype != ".mp3")
      {
        throw new Exception("只允许上传zip、rar....文件");
      }
      string dirFullPath= HttpContext.Current.Server.MapPath(virpath);
      if (!Directory.Exists(dirFullPath))//如果文件夹不存在，则先创建文件夹
      {
        Directory.CreateDirectory(dirFullPath);
      }
      file.SaveAs(dirFullPath + file.FileName);
    }

2. Ajax file asynchronous upload:

Note: Since there is a form upload, why do you need ajax upload? Because during the form upload process, the entire page is refreshed! Ajax asynchronous upload can refresh only the local position. Let’s take a brief look at ajax upload!

html client part:

 

 


 
  选择文件:

  
   

General handler server side:

public void ProcessRequest(HttpContext context)
  {
   context.Response.ContentType = "text/html";
   if (context.Request.Files.Count > 0)
   {
    HttpPostedFile file1 = context.Request.Files["myfile"];
    helper.uploadFile(file1, "~/upload/"); //这里引用的是上面封装的方法
    WriteJson(context.Response, "true", "");
   }
   else
   {
    WriteJson(context.Response, "error", "请选择要上传的文件");
   }
  }

json Code encapsulation:

public static void WriteJson(HttpResponse response,
      string status1, string msg1, object data1 = null)
    {
      response.ContentType = "application/json";
      var obj = new { status = status1, msg = msg1, data = data1 };
      string json = new JavaScriptSerializer().Serialize(obj);
      response.Write(json);
    }

Related recommendations:

Ajax multiple methods of asynchronous file upload

How to implement asynchronous uploading of files using native js

Detailed explanation of the function of asynchronous uploading of images and text using php+ajax

The above is the detailed content of Detailed explanation of form upload implementation ajax file asynchronous upload. For more information, please follow other related articles on the PHP Chinese website!