上传的图片未更改浏览器中捕获的旧图片

Question

我有一个图片上传的php文件，该文件上传了个人资料页面的用户图片。 实际上，该图像已上传到服务器文件，但显示新图像的php配置文件页面没有切换，效果很好。 如果删除浏览器的cheche和cookie，则会显示

我可以在代码中放置一些东西来执行此操作，以便用户不必在那里删除浏览器历史记录。

我也在使用会话登录名，因此不想删除会话并注销用户。

上传文件

session_start();
$userName = $_SESSION['username'];

$target_dir = "images/";  // directory the image will be placed
$target_file = basename($_FILES["fileToUpload"]["name"]); //place users file name into variable
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));  // get the file extention
$username = $userName.'.';  //get the users username
 $target_file = $target_dir . $username . $imageFileType;  //make a file name up with username and extension beginning with the directory

$uploadOk = 1;  //error check counter

// Check if image file is a actual image or fake image
if(isset($_POST["submit"])) {
    $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
    if($check !== false) {
        echo "File is an image - " . $check["mime"] . ".";
        $uploadOk = 1;
    } else {
        echo "File is not an image.";
        $uploadOk = 0;
    }
}

// Check file size
if ($_FILES["fileToUpload"]["size"] > 500000) {
    echo "Sorry, your file is too large.";
    $uploadOk = 0;
}
// Allow certain file formats
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
 && $imageFileType != "gif" ) {
    echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
    echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
} else {
    if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
        echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been 
uploaded.";
    } else {
        echo "Sorry, there was an error uploading your file.";
    }
}
?>

个人资料页

    <?php
    session_start();
    if(!isset($_SESSION["loggedin"]) || $_SESSION["loggedin"] !== true){
        header("location: login.php");
        exit;
    }
    $userName = $_SESSION['username'];
?>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>DansonRunners</title>
    <!--"This is an example of a meta description which will normaly show up in the search browser"-->
    <meta name="description" content="This is a Database Ajax Tutorial" />
    <meta name="viewpoint" content="width=device-width, inital-scale=1" />

    <script
      src="https://code.jquery.com/jquery-3.4.1.js"
      integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
      crossorigin="anonymous"
    ></script>
    <script src="profile.js"></script>
    <link rel="stylesheet" href="profile.css" >
</head>
<body>

    <center><div id="profileImg_div"></div></center>
    <a href="editProfile.php">
      <button id="seeEvent">Edit Profile</button>
    </a>

    <center><div id="username"><?php echo $userName; ?></div></center>
    <center><div>5k</div></center>
    <center><div class="container">
      <div class="pdDiv">
        <a href="fiveK.php?data=5k">
          <button>5k</button>
        </a>
      </div>
      <div class="pdDiv" id="5k_pd"></div>
    </div></center>

    <div id="7k_pd"></div>
    <div id="10k_pd"></div>
    <a href="addEvent.php">
      <button id="createEvent">Create Event</button>
    </a>
    <a href="eventsList.php">
      <button id="seeEvent">See all events</button>
    </a>
</body>
</html>

个人资料页面上的个人资料图片是通过下面的jQuery代码上传的，不确定是否会影响页面上的重新加载

function profilePage(data) {
  var profileimg = userName + ".jpg";
  $("#profileImg_div").append(
    '<img id="profileImg" src="images/' + profileimg + '"/>'
  );
}

已编辑

更改了图像以立即从php配置文件页面加载，标题具有以下内容

$image = "images/". $userName .".jpg";

和具有此元素的DOM元素

<img src="<?php echo $image; ?>">

现在似乎可以通过f5硬刷新更好地加载，但仍然无法在不进行硬刷新的情况下加载

Answer 1

使它工作。 图像是由php加载的，添加了时间，因为Zeitounator像上面这样被击中

$time = date("H:i:s");
$userName = $_SESSION['username'];
$image = "images/". $userName .".jpg?time=" . $time;

然后在HTML元素图片src中放置$ image

<img src="<?php echo $image; ?>">