Explication détaillée de la mise en œuvre du téléchargement de formulaire, téléchargement asynchrone de fichiers Ajax-tutoriel php-php.cn

Explication détaillée de la mise en œuvre du téléchargement de formulaire, téléchargement asynchrone de fichiers Ajax

小云云

Libérer： 2023-03-18 11:00:02

original

1387 Les gens l'ont consulté

Les téléchargements d'utilisateurs sont toujours indispensables dans les projets. Voici la liste principale des téléchargements de formulaires et des téléchargements ajax ! Remarque : context.Request.Files ne convient pas au traitement de fichiers volumineux. Ce qui suit est principalement destiné au traitement des téléchargements de petits fichiers ! Cet article présente principalement en détail la fonction de téléchargement de formulaire et la fonction de téléchargement de fichiers. Le téléchargement asynchrone de fichiers Ajax a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

Téléchargement des ressources :

1. Adresse de téléchargement officielle de jQuery : https://jquery.com/download/

1. 🎜>Partie client HTML :

Gestionnaire général côté serveur :

<form action="upload.ashx" method="post" enctype="multipart/form-data">
    选择文件:<input type="file" name="file1" /><br />
    <input type="submit" value="上传" />
  </form>

Copier après la connexion

Encapsulation du code de téléchargement :

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

Copier après la connexion

/// <summary>
    /// 上传图片
    /// </summary>
    /// <param name="file">通过form表达提交的文件</param>
    /// <param name="virpath">文件要保存的虚拟路径</param>
    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);
      }
    }
    /// <summary>
    /// 上传文件
    /// </summary>
    /// <param name="file">通过form表达提交的文件</param>
    /// <param name="virpath">文件要保存的虚拟路径</param>
    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);
    }

Copier après la connexion

2. Téléchargement asynchrone de fichiers Ajax :

Remarque : Puisqu'il y a un téléchargement de formulaire, pourquoi ? à propos du téléchargement ajax, encore ? Parce que pendant le processus de téléchargement du formulaire, la page entière est actualisée ! Le téléchargement asynchrone Ajax ne peut actualiser que la position locale. Jetons un bref coup d'œil au téléchargement ajax !

Partie client HTML :

Gestionnaire général côté serveur :

<head> 
<script src="jquery-2.1.4.js"></script>
 <script>
  $(function () {
   $("#upload").click(function () {
    $("#imgWait").show();
    var formData = new FormData();
    formData.append("myfile", document.getElementById("file1").files[0]); 
    $.ajax({
     url: "upload.ashx",
     type: "POST",
     data: formData,
     /**
     *必须false才会自动加上正确的Content-Type
     */
     contentType: false,
     /**
     * 必须false才会避开jQuery对 formdata 的默认处理
     * XMLHttpRequest会对 formdata 进行正确的处理
     */
     processData: false,
     success: function (data) {
      if (data.status == "true") {
       alert("上传成功！");
      }
      if (data.status == "error") {
       alert(data.msg);
      }
      $("#imgWait").hide();
     },
     error: function () {
      alert("上传失败！");
      $("#imgWait").hide();
     }
    });
   });
  });
 </script>
</head>
<body> 
  选择文件:<input type="file" id="file1" /><br />
  <input type="button" id="upload" value="上传" />
  <img src="wait.gif" style="display:none" id="imgWait" /> 
</body>

Copier après la connexion

Encapsulation de code json :

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", "请选择要上传的文件");
   }
  }

Copier après la connexion

Recommandations associées :

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);
    }

Copier après la connexion

Plusieurs méthodes de téléchargement de fichiers asynchrones via Ajax

Comment implémenter le téléchargement de fichiers asynchrone avec js natif

Explication détaillée de php+ajax pour implémenter la fonction de téléchargement asynchrone d'images et de texte

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!