Question

我想在使用jquery或PHP上传之前验证我的图像大小，高度，宽度和图像格式。我找到了很多答案，但我没有发现所有验证都在一起。

图像格式= png，图像尺寸= 2mb，图像高度= 800px，图像宽度= 600

Answer 1

您可以使用jQuery来实现这一目标。

演示代码一旦编写了正常的代码输入type =“file”并在jQuery下面写下他们的id。

$(document).ready(function(){

 var _URL = window.URL || window.webkitURL;

 $('#file').change(function () {
  var file = $(this)[0].files[0];

  img = new Image();
  var imgwidth = 0;
  var imgheight = 0;
  var maxwidth = 640;
  var maxheight = 640;

  img.src = _URL.createObjectURL(file);
  img.onload = function() {
   imgwidth = this.width;
   imgheight = this.height;

   $("#width").text(imgwidth);
   $("#height").text(imgheight);
   if(imgwidth <= maxwidth && imgheight <= maxheight){

    var formData = new FormData();
    formData.append('fileToUpload', $('#file')[0].files[0]);

    $.ajax({
      url: 'upload_image.php',
      type: 'POST',
      data: formData,
      processData: false,
      contentType: false,
      dataType: 'json',
      success: function (response) {
        if(response.status == 1){
          $("#prev_img").attr("src","upload/"+response.returnText);
          $("#prev_img").show();
          $("#response").text("Upload successfully");
        }else{
          $("#response").text(response.returnText);
        } 
      }
   });
  }else{
   $("#response").text("Image size must be "+maxwidth+"X"+maxheight);
  }
 };
 img.onerror = function() {

  $("#response").text("not a valid file: " + file.type);
 }

 });
});

Answer 2

正如您要求使用jquery或PHP，我建议您使用php进行此类验证。出于安全考虑，您必须在服务器端验证上传的文件。首先检查文件是否是您可以使用的图像

mime_content_type or finfo_open()

验证文件是图像后，您可以选择宽度和高度

list($width, $height) = getimagesize($_FILES["fileToUpload"]);

您使用的尺寸

$_FILES["fileToUpload"]["size"]

希望结合这将解决您的问题。

如何在使用jquery上传之前验证图像大小，高度，宽度和格式？

2 个答案: