我有一个脚本,它将用户id下的图像上传到服务器。要更改图片,第一个会被覆盖。问题是,旧图片和新图片的尺寸会显示一段时间,直到他们刷新浏览器。我该如何防止这种情况发生?
脚本:
function uploadProfilePicture($memberID,$extension)
{
##### FIND ERRORS #####
$error = "";
// check if larger than 5mb
$avatar = $_FILES['uploadedAvatar'];
if( $avatar["size"] > 5000000 ){ //5mb
$error = SETTINGSphoto_less_5meg;
}
//check if member selected a photo
if( $avatar['name'] == "" ){
$error = SETTINGSphoto_no_upload;
}
//check if photo is of allowed formats
if( $avatar["type"] != "image/png" ){
if( $avatar["type"] != "image/gif" ){
if( $avatar["type"] != "image/jpg" ){
if( $avatar["type"] != "image/jpeg" ){
if( $avatar["type"] != "image/pjpeg" ){
$error = SETTINGSphoto_file_type;
}
}
}
}
}
#### END FIND ERRORS #####
##### DISPLAYS ERRORS ######
if( $error != ""){
echo '<span style="background-color:#E05641;" class="pint2">'.$error.'</span>';
##### END DISPLAYS ERRORS ######
##### PROCESS THUMBNAIL AND UPLOAD PICTURE #####
}else{
$ext = substr($avatar["name"], -4); //take off extention.
$fileName = $memberID.$extension.$ext; // rename picture with member's ID.w
unlink("photos/".$memberID.$extension.".jpg");
unlink("photos/".$memberID.$extension."Thumb.jpg");
copy($avatar['tmp_name'], "photos/".$fileName); //upload temp
//create virual image
if(preg_match('/[.](jpg)$/',strtolower($avatar["name"]))) {
$im = imagecreatefromjpeg("photos/".$fileName);
} else if (preg_match('/[.](gif)$/', strtolower($avatar["name"]))) {
$im = imagecreatefromgif("photos/".$fileName);
} else if (preg_match('/[.](png)$/', strtolower($avatar["name"]))) {
$im = imagecreatefrompng("photos/".$fileName);
} else if (preg_match('/[.](jpeg)$/',strtolower($avatar["name"]))) {
$im = imagecreatefromjpeg("photos/".$fileName);
}else{
$im = imagecreatefromjpeg("photos/".$fileName);
}
//get height and width
$ox = imagesx($im); $oy = imagesy($im);
$final_width_of_image = 200;
$final_height_of_image = 200;
//$ratio = $final_width_of_image / $ox; //find ratio to apply to height
//$nx = $final_width_of_image; $ny = $oy * $ratio;
if( $ox < $oy ){
$nx = 200;
$ny = floor($oy * (200 / $ox));
}else{
$ny = 200;
$nx = floor($ox * (200 / $oy));
}
//$nm = imagecreatetruecolor($nx, $ny);
//imagecopyresampled($nm, $im, 0,0,0,0,$nx,$ny,$ox,$oy); //create new pic
$nm = imagecreatetruecolor($nx, $ny);
imagecopyresampled($nm, $im, 0,0,0,0,$nx,$ny,$ox,$oy);
unlink("photos/".$fileName); //delete temp image
imagejpeg($nm, "photos/".$memberID.$extension.".jpg",100); //save image // 100 = quality
$im = imagecreatefromjpeg("photos/".$memberID.$extension.".jpg");
$nm = imagecreatetruecolor(200, 200);
imagecopyresampled($nm, $im,0,0,0,0,200,200,200,200);
imagejpeg($nm, "photos/".$memberID.$extension."Thumb.jpg",100);
$sql = "UPDATE exchange SET photo = 1 WHERE id = '$memberID'"; //update db
$mysql = new mysql();
$mysql->query($sql);
##### END PROCESS THUMBNAIL AND UPLOAD PICTURE #####
echo '<span class="pint2">'.SETTINGSphoto_chage_success.' <a style="color:#ffffff" href="'.$_ENV['rootURL'].'/'.( in_array($_GET['lang'],$_ENV['supportedLanguages']) ? $_GET['lang']."/" : $nothing).HEADlanguage_exchange.'/id/'.$memberID.'">'.SETTINGSphoto_view_profile.'</a></span>';
}
}
问题是,旧图片和新图片的尺寸会显示一段时间,直到他们刷新浏览器。我该如何防止这种情况发生?
你可以通过告诉用户她应该清除浏览器缓存来解决这个问题。
如果这不是一个选项,那么您希望实际阻止用户缓存图像。
因此,您需要对图像的每个修订进行区分。在存储图像修订号的数据库中添加一个整数字段。然后,每次输出用户的图像时,也从数据库中获取实际的修订号。将其添加为图像URL的查询信息部分:
<img src="avatars/user/929292/photo.jpg?revision">
^^^^^^^^
浏览器仍然会缓存个人资料图片,但您会让他知道修订,因此会缓存特定的修订。
旧头像图片:
<img src="avatars/user/929292/photo.jpg?1">
然后用户上传一个新的图像,你增加修订字段,新的化身图像是:
<img src="avatars/user/929292/photo.jpg?2">
如果修订发生更改,浏览器会注意到这一点,并将从服务器中拾取图像。
您可以给新图像一个稍微不同的文件名,这样浏览器加载新图像而不是使用旧的缓存图像。
在图像源的PHP代码中,您可以附加一个时间戳,以强制照片始终显示为新照片。加入一些逻辑,只对更新的记录执行此操作,您将对缓存更加友好。
<img src="your_profile_url.jpg?<?= time(); ?>"/>