Thumbnail |
Maandag, 5 mei 2003 |
Hoe maak ik een thumbnail en sla deze op in een MySQL database?
Die vraag heeft me weken bezig gehouden voor
huizentoppers.nl.
PHP heeft krachtige functies voor image processing.
Het web biedt goede documentatie over PHP.
Toch kostte het me een wekenlange zoektocht om alle nodige programmeerdetails bij elkaar te sprokkelen.
Om collega PHP fans een soortgelijke zoektocht te besparen in deze noot een compleet beschrijving van de PHP source code.
Foto upload, Browser
- Een file uploaden gaat met standaard HTML.
- De form parameter enctype=multipart/form-data vertelt dat de posted variables meerdere delen bevatten, gewone variabelen maar mogelijk ook één of meerdere bestanden.
- Sommige browsers controleren de grootte van het bestand, indien de hidden variabele MAX_FILE_SIZE, voor de
input type=file
staat.
- De input van type file laat de gebruiker een file zoeken op de eigen PC.
De accept parameter zorgt ervoor dat sommige browsers alleen JPG files toestaan.
<![CDATA[
<HTML>
<form enctype="multipart/form-data" method="post" action="update.php3" name="form1">
<input type="hidden" name="MAX_FILE_SIZE" value="102400">
<input type="file" name="photo" accept="image/jpeg">
<input type="hidden" name="id" value="12345">
<input type=submit value="Verstuur">
</form>
</HTML>
]]>
Met dank aan de HTML adviezen van:
pangaeainc.com, Terry Schmidt.
Foto upload, validatie op server
De validatie door de browser is verre van waterdicht.
Het PHP script op de server moet dus ook de input controleren.
- De eigenschappen van de gestuurde files staan in de multidimensionale array $_FILES.
- De 1e key is de naam van de file uit de input type=file tag.
- De 2e key is de eigenschapnaam, bijvoorbeeld 'name' voor de file naam.
- Een temporary file op de server bevat de geuploade file.
De naam van die temporary file is op te zoeken in $_FILES met 2e key 'tmp_name'.
- Een extensie JPG is nog geen 100% garantie dat de geuploade file echt een JPG is.
De functie imagecreatefromstring() probeert een plaatje te maken van de file inhoud.
Alleen als dat lukt is de file een echte JPG.
<![CDATA[
<?php
$photoFileName = $_FILES['photo']['name']; // get client side file name
if ($photoFileName) // file uploaded
{ $aFileNameParts = explode(".", $photoFileName);
$sFileExtension = end($aFileNameParts); // part behind last dot
if ($sFileExtension != "jpg"
&& $sFileExtension != "JPEG"
&& $sFileExtension != "JPG")
{ die ("Kies een JPG voor de foto");
}
$nPhotoSize = $_FILES['photo']['size']; // size of uploaded file
if ($nPhotoSize == 0)
{ die ("Helaas. De upload van $photoFileName is niet gelukt.
Zoek een foto kleiner dan 100K, met behulp van de button.");
}
if ($nPhotoSize > 102400)
{ die ("Helaas.
Het bestand $photoFileName is groter dan 100K.
Advies: verklein de foto met behulp van een tekenprogramma.");
}
// read photo
$sTempFileName = $_FILES['photo']['tmp_name']; // temporary file at server side
$oTempFile = fopen($sTempFileName, "r");
$sBinaryPhoto = fread($oTempFile, fileSize($sTempFileName));
// Try to read image
$old_error_reporting = error_reporting(E_ALL & ~(E_WARNING)); // ingore warnings
$oSourceImage = imagecreatefromstring($sBinaryPhoto); // try to create image
error_reporting($old_error_reporting);
if (!$oSourceImage) // error, image is not a valid jpg
{ die ("Helaas.
Het is niet gelukt om de foto $photoFileName te lezen.
Kies een andere foto in JPG formaat.");
}
}
?>
]]>
Bron:
php.net/....
Verkleinen tot thumbnail
- Een foto snijden en verkleinen gaat verrassend eenvoudig met PHP.
- Helaas bestaan de functies
imagecreatetruecolor()
en
imagecopyresampled()
alleen vanaf PHP 4.0.6 met GD 2.0.1.
Bij oudere PHP versies zijn de functies
imagecreate()
en
imagecopyresized()
goed genoeg.
- Door de truuk met
ob_start()
en
ob_end_clean()
is het mogelijk om een thumbnail
on the fly
, in het geheugen, te genereren.
Dat scheelt onnodig geklooi met een temporary file.
- Foto's nemen relatief veel ruimte in.
De
imageJPEG()
stelt als default de kwaliteit van de foto in op 75%.
Dit spaart ruimte in de database en versnelt de thumbnail download naar de browser.
<![CDATA[
<?php
$nWidth = imagesx($oSourceImage); // get original source image width
$nHeight = imagesy($oSourceImage); // and height
// create small thumbnail
$nDestinationWidth = 80;
$nDestinationHeight = 60;
//$oDestinationImage = imagecreatetruecolor($nDestinationWidth, $nDestinationHeight);
$oDestinationImage = imagecreate($nDestinationWidth, $nDestinationHeight);
/*$oResult = imagecopyresampled(
$oDestinationImage, $oSourceImage,
0, 0, 0, 0,
$nDestinationWidth, $nDestinationHeight,
$nWidth, $nHeight); // resize the image
*/
imagecopyresized(
$oDestinationImage, $oSourceImage,
0, 0, 0, 0,
$nDestinationWidth, $nDestinationHeight,
$nWidth, $nHeight); // resize the image
ob_start(); // Start capturing stdout.
imageJPEG($oDestinationImage); // As though output to browser.
$sBinaryThumbnail = ob_get_contents(); // the raw jpeg image data.
ob_end_clean(); // Dump the result so it does not screw other output.
?>
]]>
BLOB in MySQL database
MySQL biedt de mogelijkheid om eenvoudig foto's, tekeningen en documenten op te slaan.
MySQL ondersteunt BLOBS,
binary large objects
in diverse groottes
mysql.com/....
Een standaard BLOB is groot genoeg voor een foto.
Thumbnail opslaan in database
- De binaire inhoud van een foto gaat rechtstreeks naar de BLOB, alsof het een lange string is.
- Gebruik de functie
addslashes
om bijzondere ASCII waardes die overeenkomen met o.a. quotes te behouden.
<![CDATA[
<?php
$sBinaryThumbnail = addslashes($sBinaryThumbnail);
$oDatabase = mysql_connect("localhost", "your_database_user_id", "your_database_password");
mysql_select_db("your_database_name", $oDatabase);
$sQuery = "UPDATE your_table
SET thumbnail = '$sBinaryThumbnail'
WHERE id = '$nId'";
mysql_query($sQuery, $oDatabase);
?>
]]>
Bron, artikel over BLOBs:
zdnetindia.com/...
Thumbnail tonen
![]() |
Huizentopper
thumbnail:
,
|
- Maak een image tag met als SRC parameter de URL van een speciaal PHP thumbnail script.
- Specificeer de width en height parameters in de IMG tag zodat de browser de tekst op de pagina al kan renderen voordat de thumbnail geladen is.
<![CDATA[
<HTML>
<img src="thumbnail.php?id=12345" width=80 height=60>
</HTML>
]]>
- Het PHP thumbnail script doet alsof het een JPG file is, stuurt een plaatje naar de browser.
<![CDATA[
<?php
header("Content-type: image/jpeg"); // act as a jpg file to browser
$oDatabase = mysql_connect("localhost", "your_database_user_id", "your_database_password");
mysql_select_db("your_database_name", $oDatabase);
$sQuery = "SELECT thumbnail
FROM your_table
WHERE id = $nId";
$oResult = mysql_query($sQuery, $oDatabase);
$aRow = mysql_fetch_array($oResult);
$sJpg = $aRow["thumbnail"];
echo $sJpg;
?>
]]>
Bron, nogmaals het artikel over BLOBs:
zdnetindia.com/...
Speciale dank aan Russell Graves voor debugging.
Tot
de volgende noot,
Henk Jan Nootenboom
