I am currently working with some files where "fileA.php" has an option (among other things) to upload an image to my server. The "Upload Image" button calls on "upload.php" to make sure it fits my required parameters, uploads the image, generates a random name, and then renames the image to the random name.
I want to be able to get the image's new name from upload.php back to fileA.php so I can have some sort of pop up or message for the user:
"Your image was successfully uploaded and renamed to xyz.jpg"
I am currently using a combination of jQuery and PHP POSTs to send data between file. I have seen many posts where the answer seems to be "echo the data you want from upload.php and then require the upload file in fileA.php", but I can't get that to work, and I would ideally like the returned random file name generated in upload.php to be saved in a variable in fileA.php
Am I out of luck folks? Thanks for reading.
In the following code that would be found at the end of my "upload.php" file, I would like to return the value of $mediaPath back to fileA.php
if ($uploadOk == 0) {
echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
} else {
if (move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file)) {
$randName = substr(md5(rand()), 0, 15) . '.' . $imageFileType; //generates a pseudorandom string 2^31(? I think so, also saw 2^32 somewhere, but how?) possibilities, as the md5 hash of a random int truncated to 15 characters
rename($target_file, "/var/www/html/uploads/" . $randName);
echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded and renamed to <new name here>";
} else {
echo "Sorry, there was an error uploading your file.";
}
}
$mediaPath = "/var/www/html/uploads/" . $randName;
return $mediaPath;
and then I think I need to implement some sort of jQuery function in "fileA.php" like the following:
$.ajax({
type: "POST",
url: "upload.php",
datatype: "html",
data: dataString,
success: function(data) {
alert(data);
}
});
And this could fetch the value of "$mediaPath" and alert it out for me -- so far this does not give me any values of "data" that would be inserted in to the file, it just outputs the generic statements hardcoded in to upload.php?
Going to keep giving it a shot, would love to finally crack this case! Open to all reasonable suggestions on how to do this/best practices, cheers.
Edit - tried updating to include Jamie M's answer:
my jQuery:
$(document).ready(function() {
$('#imageForm').ajaxForm(function() {
$.ajax({
type: "POST",
url: "upload.php",
dataType: "json", // We want a JSON response
data: dataString, // I have to assume this is already set by the upload utility
success: function(data) {
alert(data.image); // Specify the index
}
});
});
});
</script>
my HTML/PHP: Select image to upload:
my upload.php
header('Content-type: application/json'); // Tell the browser what to expect so it can handle it properly
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));
// Grabs the file extension of the submitted file, to be used on/around line 28
if(isset($_POST["submit"])) {
$check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
if($check !== false) {
echo "File is an image - " . $check["mime"] . ".";
$uploadOk = 1;
} else {
echo "File is not an image.";
$uploadOk = 0;
}
}
// Checks uploads/ to see if file already exists, throws uploadOk to 0 therefore sending an error if it does. This is probably going to be made useless by randomizing the upload names. Also what if two people want to use the same picture?
if (file_exists($target_file)) {
echo "Sorry, file already exists.
";
$uploadOk = 0;
}
// Check file size
if ($_FILES["fileToUpload"]["size"] > 2000000) {
echo "Sorry, your file is too large.
";
$uploadOk = 0;
}
// Allow certain file formats, checks to make sure it is a valid image
format using $imageFileType
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.
";
$uploadOk = 0;
}
// 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["fileToUpload"]["tmp_name"],
$target_file)) {
$randName = substr(md5(rand()), 0, 15) . '.' . $imageFileType;
//generates a pseudorandom string 2^31(? I think so, also saw 2^32 somewhere, but how?) possibilities, as the md5 hash of a random int truncated to 15 characters
rename($target_file, "/var/www/html/uploads/" . $randName);
$data = ['image' => $randName]; // You can add as many items as you like here
echo "The file ". basename( $_FILES["fileToUpload"]["name"]). " has been uploaded and renamed to <new name here>";
} else {
echo json_encode($data);
}
}
echo json_encode($data); // Encode it properly to ensure the response is valid for browser parsing
?>
So far I am unsuccessful and the above code (seemingly) does not return any values from upload.php, and there are no visible errors in the console.