I am new to PHP and a little rusty when it comes to programming in general...
I have images on my Mac that I select and upload via PHP as blobs in a mySQL DB. They will then be embedded in a gallery on a website but I want to blur them first. After I read them from the DB, I am using a combination of image functions for this but I am not sure the image I pass is in the right format since they are not rendered on the website.
Code snippets below.
Upload (works fine):
for ($i = 0; $i < $size; $i++) {
$name = basename($_FILES['image']['name'][$i]);
$type = pathinfo($name, PATHINFO_EXTENSION);
$size = $_FILES['image']['size'][$i];
$temp = $_FILES['image']['tmp_name'][$i];
$allowTypes = array('jpg', 'png', 'jpeg', 'gif');
if (in_array($type, $allowTypes)) {
$imgContent = addslashes(file_get_contents($temp));
// Insert image content into database
$insert = $db->query("INSERT into images (filename, image, page, created) VALUES ('$name','" . $imgContent . "', '$page', NOW())");
if ($insert) {
$status = 'success';
$statusMsg = "File uploaded successfully.";
} else {
$statusMsg = "File upload failed, please try again.";
}
} else {
$statusMsg = 'Sorry, only JPG, JPEG, PNG, & GIF files are allowed to upload.';
}
}
Retrieve images from DB and render them after calling a blur function (the 2nd IMG tag that I commented out is the one that works without blurring the images):
<?php
// Include the database configuration file
require_once 'dbConfig.php';
include 'blurimage.php';
// Get image data from database
$sql = "SELECT image FROM images ORDER BY id DESC";
$result = $db->query($sql);
?>
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Retrieve Images from Database using PHP by CodexWorld</title>
<meta charset="utf-8">
<!-- Custom stylesheet -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="container">
<h1>Retrieve Images from Database using PHP</h1>
<div class="gallery">
<?php if ($result->num_rows > 0) { ?>
<?php while ($row = $result->fetch_assoc()) { ?>
<?php $image = $row['image']; ?>
<?php ?>
<div class="img-box">
<img src="<?php blur($image)?>"
<!-- <img src="data:image/jpg;charset=utf8;base64,<?php echo base64_encode($row['image']); ?>" /> -->
</div>
<?php } ?>
<?php } else { ?>
<p class="status error">Image(s) not found...</p>
<?php } ?>
</div>
<a href="index.php">Upload images</a>
</div>
</body>
</html>
Blur function in separate blurimage.php page:
<?php
function blur($image)
{
// $start = microtime(true);
/* Scale by 25% and apply Gaussian blur */
$s_img1 = imagecreatetruecolor(160, 120);
imagecopyresampled($s_img1, $image, 0, 0, 0, 0, 160, 120, 640, 480);
imagefilter($s_img1, IMG_FILTER_GAUSSIAN_BLUR);
/* Scale result by 200% and blur again */
$s_img2 = imagecreatetruecolor(320, 240);
imagecopyresampled($s_img2, $s_img1, 0, 0, 0, 0, 320, 240, 160, 120);
imagedestroy($s_img1);
imagefilter($s_img2, IMG_FILTER_GAUSSIAN_BLUR);
/* Scale result back to original size and blur one more time */
imagecopyresampled($image, $s_img2, 0, 0, 0, 0, 640, 480, 320, 240);
imagedestroy($s_img2);
imagefilter($image, IMG_FILTER_GAUSSIAN_BLUR);
//$end = microtime(true);
//$howlong = $end - $start;
return $image;
}
?>
I also tried to pass the blob directly from the DB without any transformation but that didn't work either as expected.