Question

我想通过Ajax调用上传图像，但是我不能上传图像。请检查我的代码我在做什么错：

HTML文件：

<input class="form-control" type="file" name="photo1" id="photo1" accept="image/*" onchange="loadFile2(event)">


<button type="button" class="btn btn-secondary btn-lg btn-block" onclick="createDocsVerify()">Update Details</button>

Ajax呼叫：

<script>
 function createDocsVerify () {

  var data = {
   'photo1'     : jQuery('#photo1').val(),
  }; 

  //Ajax call Start Here
  jQuery.ajax({
    url : '/myproject/adminseller/sellerdocsverify.php',
    method : 'POST',
    data : data,
    success : function(data){

    if (data != 'passed') { 
     jQuery('#modal_errors_3').html(data);
    }

    if (data == 'passed') {

     jQuery('#modal_errors_3').html("");
     location.reload();
   }
   },
   error : function (){alert("Something went wrong.");},

   });    

  }
  </script>

Php文件：Sellerdocsverify.php

if (isset($_POST['photo1'])) {
   $photo1 = sanitize($_POST['photo1']);
   // var_dump Output: string(20) "C:\fakepath\0553.jpg" 
 }


 $errors = array();
  $required = array(
   'photo1'  => 'Please select Photo 1',
);



// check if all required fileds are fill out
foreach ($required as $field => $display) {
 if (empty($_POST[$field]) || $_POST[$field] == '') {
  $errors[] = $display.'.';
 }
 }


$allowed = array('png', 'jpg', 'jpeg', 'gif');
$photoNameArray = array();
$tmpLoc = array();
$uploadPath = array();



**// Here is the problem**
$name1 = $_FILES['photo1']['name']; // Here is the problem
Var_dump($name1); // OUTPUT: NULL
**// Here is the problem**



$nameArray = explode('.',$name1);
$fileName = $nameArray[0];
$fileExt = $nameArray[1];  

$mime = $_FILES['photo1']['type'];
$mimeType = $mime[0];
$mimeExt = $mime[1];
$tmpLoc = $_FILES['photo1']['tmp_name'];
$fileSize = $_FILES['photo1']['size'];

$uploadName = md5(microtime().$j).'.'.$fileExt;
$uploadPath = BASEURL.'images/products/'.$uploadName;

if ($mimeType != 'image') {
 $errors[] = 'The file must be an image.';
}



if (!empty($errors)) {
  echo display_errors($errors);
 }else{
  echo 'passed';

   // upload file and insert into database
  if ($photoCount > 0) {        
    move_uploaded_file($tmpLoc1, $uploadPath1);
   }

$insertSql = "INSERT INTO docTable  (`photo1`)
VALUES ('$photo1')";
$db->query($insertSql);

$_SESSION['success_flash'] = '<span style="color:#FFFFFF;text-align:center;">Data Saved Successfully!</span>';


}
?>

请检查我的代码并建议我做错了什么，我在Ajax调用或php中做错了什么，我在$ photo1中得到了值。

任何想法或建议都会受到欢迎。

Answer 1

您需要执行一些特殊的“操作”才能通过AJAX上传文件。您需要创建一个FormData对象并手动向其中添加文件数据，并将AJAX调用的contentType，processData和cache选项设置为false。您的JavaScript看起来应该像这样：

<script>
function createDocsVerify() {
    var formdata = new FormData();
    var file = jQuery('#photo1').prop('files')[0];
    formdata.append('photo1', file);

    //Ajax call Start Here
    jQuery.ajax({
        url: '/myproject/adminseller/sellerdocsverify.php',
        method: 'POST',
        cache: false,
        contentType: false,
        processData: false,
        data: formdata,
        success: function(data) {
            if (data != 'passed') {
                jQuery('#modal_errors_3').html(data);
            }
            if (data == 'passed') {
                jQuery('#modal_errors_3').html("");
                location.reload();
            }
        },
        error: function() {
            alert("Something went wrong.");
        },
    });
}
</script>

应该上传照片。

在php中通过Ajax调用上传图片时遇到问题？

1 个答案: