How to show images that have been uploaded to site by users, on page?
Question
So I have created a php file that allows users to upload images to a directory (/uploads), now I wish to allow them to see these images on a page, I've heard that you can use JavaScript for this? If so, How would I do that?
Here's the code I have so far;
HTML (Basic Upload form);
<html>
<body>
<form action="upload_file.php" method="post"
enctype="multipart/form-data">
<label for="file">Filename:</label>
<input type="file" name="file" id="file"><br>
<input type="submit" name="submit" value="Submit">
</form>
</body>
</html>
PHP Upload_file;
<?php
$allowedExts = array("gif", "jpeg", "jpg", "png");
$allowedTypes = array("image/gif",'..','..',"image/png");
$temp = explode(".", $_FILES["file"]["name"]);
$extension = end($temp);
if ((in_array($_FILES["file"]["type"], $allowedTypes))
&& ($_FILES["file"]["size"] < 20000)
&& in_array($extension, $allowedExts))
{
if ($_FILES["file"]["error"] > 0)
{
echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
}
else
{
if (file_exists("upload/" . $_FILES["file"]["name"]))
{
echo $_FILES["file"]["name"] . " already exists. ";
}
else
{
move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]);
header('Location: index.html');
}
}
}
else
{
echo "Invalid file";
}
?>
2 answers
solution1
0 2014-01-26 19:55:40
You can either replace header('Location: index.html'); and replace it by : echo '<img src="upload/' . $_FILES["file"]["name"] . '" />'; which will display the picture on the php upload file (admitting it's a file which is supposed to display content and not just a back end file as it seems to be as you want to user to be redirected to index.html).
The best way and most convenient way to do that is to save the picture path, or name ( "upload/" . $_FILES["file"]["name"] ) in a mysql table to e able to retreive it as you please. You might want to have a look over tehre : http://fr2.php.net/manual/fr/book.pdo.php
solution2
0 2014-01-26 20:01:37
This depends on how you want users to see these images. I'm assuming you mean that any image uploaded can be viewed by anybody (not on a per user basis). One way you could do this without modifying your existing code would be to get a list all image files in PHP from the uploads folder. For example, you could have a file showimage.php containing:
<?php
$imgArray = scandir("upload");
foreach($imgArray as $img){
echo "<img src='" . $img . "' />";
}
?>
The scandir function lists all files http://www.php.net/manual/en/function.scandir.php
Also, I'm assuming your uploads folder only contains images. If you have other files in there, you could use the glob function instead (once for each type). http://us3.php.net/glob
Edit: Also, as the other poster stated, if you want to do anything else with these images, it might be a good idea to store their paths (with the user who uploaded them) so you can retrieve it in a more direct way.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.