Php 修改代码以实现AJAX_Php_Ajax

Php 修改代码以实现AJAX

php ajax

Php 修改代码以实现AJAX,php,ajax,Php,Ajax,我有这两个文件index.php和uploadcover.inc.php，并提交index.php的表单，输入字段为file，它允许我们上传一个图像以设置为封面图片。代码可以正常工作，但是我想修改这个index.php文件，使用AJAX实现它，而不需要刷新页面，也不需要使用header函数将uploadcover.inc.php重定向回index.php。请帮我解决这个问题 index.php=> <?php session_start(); ?> <!DOCTYPE html

我有这两个文件index.php和uploadcover.inc.php，并提交index.php的表单，输入字段为file，它允许我们上传一个图像以设置为封面图片。代码可以正常工作，但是我想修改这个index.php文件，使用AJAX实现它，而不需要刷新页面，也不需要使用header函数将uploadcover.inc.php重定向回index.php。请帮我解决这个问题

index.php=>

<?php session_start(); ?>
<!DOCTYPE html>
<html>
<body>
    <form action="include/uploadcover.inc.php" method="post" enctype="multipart/form-data">
    <input type="file" name="file" id="cover-upload" style="display:none" onchange="this.form.submit();">
    <label for="cover-upload" class="fa fa-camera fa-2x" aria-hidden="true"></label>
    </form>
</body>
</html>

uploadcover.inc.php=>

<?php
session_start();
include_once 'dbh.inc.php';
$sessionid = $_SESSION['u_id'];
  $file= $_FILES['file'];
  $fileName= $file['name'];
  $fileTmpName= $file['tmp_name'];
  $fileSize= $file['size'];
  $fileError= $file['error'];
  $fileType= $file['type'];

  $fileExt = explode('.',$fileName);
  $fileActualExt = strtolower(end($fileExt));

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

  if(in_array($fileActualExt,$allowed)){
    if($fileError=== 0){
      if($fileSize<3145728){
        $fileNameNew = "cover".$sessionid.".".$fileActualExt;
        $fileDestination = '../profile/'.$fileNameNew;
        move_uploaded_file($fileTmpName,$fileDestination);
        $sql = "UPDATE coverimg SET status=0 WHERE user_id='$sessionid'";
        mysqli_query($conn,$sql);
        header("Location: ../index.php?upload=success");
      } else {
        $_SESSION['errors']['size'] = 1;
        session_write_close();
        header("Location: ../index.php?upload=size_exceeded_3MB");
      }
    } else {
      $_SESSION['errors']['upload'] = 1;
      session_write_close();
      header("Location: ../index.php?upload=error");
    }
  } else{
    $_SESSION['errors']['type'] = 1;
    session_write_close();
    header("Location: ../index.php?upload=typeerror");
  }

如果您使用的是jQuery，那么它已经实现了一个函数。
您可以使用该函数
如果您使用的是jquery，那么它有一个函数$。ajax（）已经实现

您无法使用ajax在PHP中重定向，您需要从PHP返回url，并使用window.location.href
重定向到所需的url。现在您使用的是ajax，您不需要错误URL（index.php？upload=error
，upload=size\u\u超过3M
和index.php？upload=typeerror
），您需要添加
）来向用户显示错误消息
让我们通过更改onchange
来修改表单，以调用ajax函数
<form action="include/uploadcover.inc.php" method="post" enctype="multipart/form-data">
    <input type="file" name="file" id="cover-upload" style="display:none" onchange="submit_cover()">
    <label for="cover-upload" class="fa fa-camera fa-2x" aria-hidden="true"></label>
</form>


从PHP中删除header
函数，并将响应返回到Javascript并从那里重定向
<?php
session_start();
include_once 'dbh.inc.php';
$sessionid = $_SESSION['u_id'];
$file = $_FILES['file'];
$fileName = $file['name'];
$fileTmpName = $file['tmp_name'];
$fileSize = $file['size'];
$fileError = $file['error'];
$fileType = $file['type'];

$fileExt = explode('.', $fileName);
$fileActualExt = strtolower(end($fileExt));

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

$response = [];

if (in_array($fileActualExt, $allowed)) {
    if ($fileError === 0) {
        if ($fileSize < 3145728) {
            $fileNameNew = "cover" . $sessionid . "." . $fileActualExt;
            $fileDestination = '../profile/' . $fileNameNew;
            if (move_uploaded_file($fileTmpName, $fileDestination)) {
                // if file was moved update database with the new data
                $sql = "UPDATE coverimg SET status=0 WHERE user_id='$sessionid'";
                mysqli_query($conn, $sql);
                $response['redirect'] = '../index.php?upload=success';
            } else {
                $response['moveerror'] = 'Unable to move the file';
            }
        } else {
            $_SESSION['errors']['size'] = 1;
            session_write_close();
            $response['sizeerror'] = 'Upload size exceeded';
        }
    } else {
        $_SESSION['errors']['upload'] = 1;
        session_write_close();
        $response['uploaderror'] = 'Upload error';
    }
} else {
    $_SESSION['errors']['type'] = 1;
    session_write_close();
    $response['typeerror'] = 'Allowed types: jpg, jpeg, png and gif';
}

echo json_encode($response);

参见
function submit_cover() {
    var formData = new FormData($('form')[0]); // Create an arbitrary FormData instance

    $.ajax('include/uploadcover.inc.php', {
        type        : 'POST',
        processData : false,
        contentType : false,
        data        : formData,
        success     : function (data) {
            var response = JSON.parse(data);
            if (response.redirect) {
                window.location.href = response.redirect;
            }else if (response.moveerror) {
                $('#display-error').html(response.moveerror);
            }else if (response.sizeerror) {
                $('#display-error').html(response.sizeerror);
            }else if (response.uploaderror) {
                $('#display-error').html(response.uploaderror);
            }else if (response.typeerror) {
                $('#display-error').html(response.typeerror);
            }
        }
    });
}

<?php
session_start();
include_once 'dbh.inc.php';
$sessionid = $_SESSION['u_id'];
$file = $_FILES['file'];
$fileName = $file['name'];
$fileTmpName = $file['tmp_name'];
$fileSize = $file['size'];
$fileError = $file['error'];
$fileType = $file['type'];

$fileExt = explode('.', $fileName);
$fileActualExt = strtolower(end($fileExt));

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

$response = [];

if (in_array($fileActualExt, $allowed)) {
    if ($fileError === 0) {
        if ($fileSize < 3145728) {
            $fileNameNew = "cover" . $sessionid . "." . $fileActualExt;
            $fileDestination = '../profile/' . $fileNameNew;
            if (move_uploaded_file($fileTmpName, $fileDestination)) {
                // if file was moved update database with the new data
                $sql = "UPDATE coverimg SET status=0 WHERE user_id='$sessionid'";
                mysqli_query($conn, $sql);
                $response['redirect'] = '../index.php?upload=success';
            } else {
                $response['moveerror'] = 'Unable to move the file';
            }
        } else {
            $_SESSION['errors']['size'] = 1;
            session_write_close();
            $response['sizeerror'] = 'Upload size exceeded';
        }
    } else {
        $_SESSION['errors']['upload'] = 1;
        session_write_close();
        $response['uploaderror'] = 'Upload error';
    }
} else {
    $_SESSION['errors']['type'] = 1;
    session_write_close();
    $response['typeerror'] = 'Allowed types: jpg, jpeg, png and gif';
}

echo json_encode($response);