I'm trying to upload a file to a server then display it to the user. I'm having difficulties to display the image to the user.
If you could provide code that helps me out to display the image to the user. The code should fit in the php file right under //Display image here <---------
html file
<html>
<body>
<form method="post" enctype="multipart/form-data" action="server.php">
<input type="file" name="fileToUpload" id="fileToUpload" size="35">
<br>
<br>
<input type="submit" value="Upload" name="upload">
</body>
</html>
php file
<?php
if(isset($_FILES["fileToUpload"])){
$file = $_FILES['fileToUpload'];
$fileName = $_FILES["fileToUpload"]["name"];
$fileTmpName = $_FILES["fileToUpload"]["tmp_name"];
$fileSize = $_FILES["fileToUpload"]["size"];
$fileError = $_FILES["fileToUpload"]["error"];
$fileType = $_FILES["fileToUpload"]["type"];
$fileExt = explode('.', $fileName);
$fileActualExt = strtolower(end($fileExt));
$allowed = array('jpg', 'jpeg', 'png');
if(in_array($fileActualExt, $allowed)){
//Image code
if($fileError === 0){
if($fileSize < 500000){
$fileDestination = 'uploads/'.$fileName;
move_uploaded_file($fileTmpName, $fileDestination);
header("Location: server.php?uploadsuccess");
//Display image here <----------
}else{
echo "Your file is too big!";
}
}else{
echo "There was an error while uploading your file!";
}
}else{
if(isset($_FILES["fileToUpload"])){
$file = $_FILES["fileToUpload"]["name"];
echo "File: ".$file;
}
}
}
?>
first you have to change .html file to .php and note that i have renamed file as index.php
<html>
<body>
<?php if(isset($_GET['filename'])){ ?>
<img src="<?php echo $_GET['filename']; ?>" />
<?php } ?>
<form method="post" enctype="multipart/form-data" action="server.php">
<input type="file" name="fileToUpload" id="fileToUpload" size="35">
<br>
<br>
<input type="submit" value="Upload" name="upload">
</body>
</html>
server.php
<?php
if(isset($_FILES["fileToUpload"])){
$file = $_FILES['fileToUpload'];
$fileName = $_FILES["fileToUpload"]["name"];
$fileTmpName = $_FILES["fileToUpload"]["tmp_name"];
$fileSize = $_FILES["fileToUpload"]["size"];
$fileError = $_FILES["fileToUpload"]["error"];
$fileType = $_FILES["fileToUpload"]["type"];
$fileExt = explode('.', $fileName);
$fileActualExt = strtolower(end($fileExt));
$allowed = array('jpg', 'jpeg', 'png');
if(in_array($fileActualExt, $allowed)){
//Image code
if($fileError === 0){
if($fileSize < 500000){
$fileDestination = 'uploads/'.$fileName;
move_uploaded_file($fileTmpName, $fileDestination);
// header("Location: server.php?uploadsuccess");
//Display image here <----------
header("Location:index.php?filename=$fileDestination");
}else{
echo "Your file is too big!";
}
}else{
echo "There was an error while uploading your file!";
}
}else{
if(isset($_FILES["fileToUpload"])){
$file = $_FILES["fileToUpload"]["name"];
echo "File: ".$file;
}
}
}
?>
I have done using php but better option is using ajax call .just google it you will get man examples
To be able to display the image, do this :
//Display image here <----------
echo "<img src='" . $fileLocation . "'>";
Replace $file_location with the variable containing the file location
<!-- index.php -->
<form action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="file2upload">
<input type="submit" value="upload">
</form>
<!-- sorry i didn't got php code section here , so i m posting php file code here -->
<!-- upload.php file -->
<?php
// target directory where files goes after uploading
$target_dir = "uploads/pictures/";
// target files name and extension save to this target_file variable
// $target_file specifies the path of the file to be uploaded
$target_file = $target_dir . basename($_FILES["file2upload"]["name"]);
$uploadOk = 1;
// checking that target_file is been uploading is a true image file extenion or not
// $audioFileType holds the file extension of the file (in lower case)
$picFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));
echo $picFileType."<br />";
if(isset($_POST["submit"])) {
// The filesize() function in PHP is an inbuilt function which is used to return the size of a specified file.
// The filesize() function accepts the filename as a parameter and returns the size of a file in bytes on success and False on failure.
$check = getimagesize($_FILES["file2upload"]["tmp_name"]);
if($check !== false) {
echo "File is an image - " . $check["mime"] . ".";
$uploadOk = 1;
} else {
echo "File is not an image.";
$uploadOk = 0;
}
}
// step:2
// Check if file already exists
if (file_exists($target_file)) {
echo "Sorry, file already exists.";
$uploadOk = 0;
}
// step: 3
// Check file size
if ($_FILES["file2upload"]["size"] > 5000000) { // 5MB manual set
echo "Sorry, your file is too large.";
$uploadOk = 0;
}
// step: 4
// Allow certain file formats
if($picFileType != "jpeg" && $picFileType != "jpg" && $picFileType != "bmp" && $picFileType != "gif" && $picFileType != "png" ) {
$uploadOk = 0;
echo "<b style='color:red;'> File to be uploading is not have image formates like : .jpeg,.jpg,.bmp, .gif, .png etc </b><br />";
}
// step: 5
// 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["file2upload"]["tmp_name"], $target_file))
{
echo "The file ". basename( $_FILES["file2upload"]["name"]). " has been uploaded. <br />";
<!-- this is the ANSWER -->
<!-- ----------------------------- -->
echo $file_name = basename( $_FILES["file2upload"]["name"]);
echo $file_size = $_FILES["file2upload"]["size"];
echo $fileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));
<!-- ----------------------------- -->
}
else {
echo "Sorry, there was an error uploading your file.";
}
}
// }else{ echo "<b style='color:red;'> form have diffrent method ( post/get ) </b><br />"; $uploadOk = 0; }
?></div>