I made a page where you can upload pictures onto a folder on my computer called uploads. I tested that page and everything worked out fine, but when I try to make a table with links to the pictures that opens in a pop-up window, I get an error saying the requested URL was not found on the server.
Here are my two codes:
for uploading:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Upload an Image</title>
<style type="text/css" title="text/css" media="all">
.error {
font-weight: bold;
color: #C00
}
</style>
</head>
<body>
<?php # Script 10.3 - upload_image.php
// Check if the form has been submitted:
if (isset($_POST['submitted'])) {
// Check for an uploaded file:
if (isset($_FILES['upload'])) {
// Validate the type. Should be JPEG or PNG.
$allowed = array ('image/pjpeg', 'image/jpeg', 'image/JPG', 'image/X-PNG', 'image/PNG', 'image/png', 'image/x-png');
if (in_array($_FILES['upload']['type'], $allowed)) {
// Move the file over.
if (move_uploaded_file ($_FILES['upload']['tmp_name'], "C:/xampp/uploads/{$_FILES['upload']['name']}")) {
echo '<p><em>The file has been uploaded!</em></p>';
} // End of move... IF.
} else { // Invalid type.
echo '<p class="error">Please upload a JPEG or PNG image.</p>';
}
} // End of isset($_FILES['upload']) IF.
// Check for an error:
if ($_FILES['upload']['error'] > 0) {
echo '<p class="error">The file could not be uploaded because: <strong>';
// Print a message based upon the error.
switch ($_FILES['upload']['error']) {
case 1:
print 'The file exceeds the upload_max_filesize setting in php.ini.';
break;
case 2:
print 'The file exceeds the MAX_FILE_SIZE setting in the HTML form.';
break;
case 3:
print 'The file was only partially uploaded.';
break;
case 4:
print 'No file was uploaded.';
break;
case 6:
print 'No temporary folder was available.';
break;
case 7:
print 'Unable to write to the disk.';
break;
case 8:
print 'File upload stopped.';
break;
default:
print 'A system error occurred.';
break;
} // End of switch.
print '</strong></p>';
} // End of error IF.
// Delete the file if it still exists:
if (file_exists ($_FILES['upload']['tmp_name']) && is_file($_FILES['upload']['tmp_name']) ) {
unlink ($_FILES['upload']['tmp_name']);
}
} // End of the submitted conditional.
?>
<form enctype="multipart/form-data" action="upload_image.php" method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="524288">
<fieldset><legend>Select a JPEG or PNG image of 512KB or smaller to be uploaded:</legend>
<p><b>File:</b> <input type="file" name="upload" /></p>
</fieldset>
<div align="center"><input type="submit" name="submit" value="Submit" /></div>
<input type="hidden" name="submitted" value="TRUE" />
</form>
</body>
</html>
for the table:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Images</title>
<script language="JavaScript">
<!-- // Hide from old browsers.
// Make a pop-up window function:
function create_window (image, width, height) {
// Add some pixels to the width and height:
width = width + 10;
height = height + 10;
// If the window is already open,
// resize it to the new dimensions:
if (window.popup && !window.popup.closed) {
window.popup.resizeTo(width, height);
}
// Set the window properties:
var specs = "location=no, scrollbars=no, menubars=no, toolbars=no, resizable=yes, left=0, top=0, width=" + width + ", height=" + height;
// Set the URL:
var url = "show_image.php?image=" + image;
// Create the pop-up window:
popup = window.open(url, "ImageWindow", specs);
popup.focus();
} // End of function.
//--></script>
</head>
<body>
<p>Click on an image to view it in a separate window.</p>
<table align="center" cellspacing="5" cellpadding="5" border="1">
<tr>
<td align="center"><b>Image Name</b></td>
<td align="center"><b>Image Size</b></td>
</tr>
<?php # Script 10.4 - images.php
// This script lists the images in the uploads directory.
$dir = 'C:/xampp/uploads'; // Define the directory to view.
$files = scandir($dir); // Read all the images into an array.
// Display each image caption as a link to the JavaScript function:
foreach ($files as $image) {
if (substr($image, 0, 1) != '.') { // Ignore anything starting with a period.
// Get the image's size in pixels:
$image_size = getimagesize ("$dir/$image");
// Calculate the image's size in kilobytes:
$file_size = round ( (filesize ("$dir/$image")) / 1024) . "kb";
// Make the image's name URL-safe:
$image = urlencode($image);
// Print the information:
echo "\t<tr>
\t\t<td><a href=\"javascript:create_window('$image',$image_size[0],$image_size[1])\">$image</a></td>
\t\t<td>$file_size</td>
\t</tr>\n";
} // End of the IF.
} // End of the foreach loop.
?>
</table>
</body>
</html>
That last code written with both PHP and JavaScript.
This is what comes up when I click the links:
Object not found!
The requested URL was not found on this server. The link on the referring page seems to be wrong or outdated. Please inform the author of that page about the error.
If you think this is a server error, please contact the webmaster.
Error 404
localhost
8/24/2011 3:51:44 PM
Apache/2.2.17 (Win32) mod_ssl/2.2.17 OpenSSL/0.9.8o PHP/5.3.4 mod_perl/2.0.4 Perl/v5.10.1
Any help?
According to your error this file: http://localhost/show_image.php either doesn't exist or is triggering a 404. Paste that into your browser's address, does it do the same?
According to your error this file: http://localhost/show_image.php either doesn't exist or is triggering a 404. Paste that into your browser's address, does it do the same?
Yes, but now for some reason, even in the pop-up window, there is a new error. It says:
The image "http://localhost/show_image.php?image=IMG_0188.JPG" cannot be displayed because it contains errors.
This comes up in the browser, and the pop-up window
The images are from a folder on my computer, and my code just goes to the folder and takes the pictures in it and makes a table.
No, we mean that the script itself is being served as an image type. We need to see the code to troubleshoot the problem (you're image resource is corrupt from the script's point of view).
No, we mean that the script itself is being served as an image type. We need to see the code to troubleshoot the problem (you're image resource is corrupt from the script's point of view).
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Images</title>
<script language="JavaScript">
<!-- // Hide from old browsers.
// Make a pop-up window function:
function create_window (image, width, height) {
// Add some pixels to the width and height:
width = width + 10;
height = height + 10;
// If the window is already open,
// resize it to the new dimensions:
if (window.popup && !window.popup.closed) {
window.popup.resizeTo(width, height);
}
// Set the window properties:
var specs = "location=no, scrollbars=no, menubars=no, toolbars=no, resizable=yes, left=0, top=0, width=" + width + ", height=" + height;
// Set the URL:
var url = "show_image.php?image=" + image;
// Create the pop-up window:
popup = window.open(url, "ImageWindow", specs);
popup.focus();
} // End of function.
//--></script>
</head>
<body>
<p>Click on an image to view it in a separate window.</p>
<table align="center" cellspacing="5" cellpadding="5" border="1">
<tr>
<td align="center"><b>Image Name</b></td>
<td align="center"><b>Image Size</b></td>
</tr>
<?php # Script 10.4 - images.php
// This script lists the images in the uploads directory.
$dir = 'C:/xampp/uploads'; // Define the directory to view.
$files = scandir($dir); // Read all the images into an array.
// Display each image caption as a link to the JavaScript function:
foreach ($files as $image) {
if (substr($image, 0, 1) != '.') { // Ignore anything starting with a period.
// Get the image's size in pixels:
$image_size = getimagesize ("$dir/$image");
// Calculate the image's size in kilobytes:
$file_size = round ( (filesize ("$dir/$image")) / 1024) . "kb";
// Make the image's name URL-safe:
$image = urlencode($image);
// Print the information:
echo "\t<tr>
\t\t<td><a href=\"javascript:create_window('$image',$image_size[0],$image_size[1])\">$image</a></td>
\t\t<td>$file_size</td>
\t</tr>\n";
} // End of the IF.
} // End of the foreach loop.
?>
</table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Images</title>
<script language="JavaScript">
<!-- // Hide from old browsers.
// Make a pop-up window function:
function create_window (image, width, height) {
// Add some pixels to the width and height:
width = width + 10;
height = height + 10;
// If the window is already open,
// resize it to the new dimensions:
if (window.popup && !window.popup.closed) {
window.popup.resizeTo(width, height);
}
// Set the window properties:
var specs = "location=no, scrollbars=no, menubars=no, toolbars=no, resizable=yes, left=0, top=0, width=" + width + ", height=" + height;
// Set the URL:
var url = "show_image.php?image=" + image;
// Create the pop-up window:
popup = window.open(url, "ImageWindow", specs);
popup.focus();
} // End of function.
//--></script>
</head>
<body>
<p>Click on an image to view it in a separate window.</p>
<table align="center" cellspacing="5" cellpadding="5" border="1">
<tr>
<td align="center"><b>Image Name</b></td>
<td align="center"><b>Image Size</b></td>
</tr>
<?php # Script 10.4 - images.php
// This script lists the images in the uploads directory.
$dir = 'C:/xampp/uploads'; // Define the directory to view.
$files = scandir($dir); // Read all the images into an array.
// Display each image caption as a link to the JavaScript function:
foreach ($files as $image) {
if (substr($image, 0, 1) != '.') { // Ignore anything starting with a period.
// Get the image's size in pixels:
$image_size = getimagesize ("$dir/$image");
// Calculate the image's size in kilobytes:
$file_size = round ( (filesize ("$dir/$image")) / 1024) . "kb";
// Make the image's name URL-safe:
$image = urlencode($image);
// Print the information:
echo "\t<tr>
\t\t<td><a href=\"javascript:create_window('$image',$image_size[0],$image_size[1])\">$image</a></td>
\t\t<td>$file_size</td>
\t</tr>\n";
} // End of the IF.
} // End of the foreach loop.
?>
</table>
</body>
</html>
So now I'm confused. This page is show_image.php, which has the task to open a popup window back to itself? The image passed isn't handled in any way, so I'm not sure what you are hoping to do with this?
The error you have posted indicates that show_image is pushing an image type header, but either not handling an image or pumping invalid binary. This script does not push a header for an image type, indicating that the above script is NOT show_image.php.
You're confused? - I see no code anywhere that really handles the image yet it attempts to put the image file name out and link to an image outside and above the public directory
//Please don't use this for your form processing:
if (isset($_POST['submit']))
//Internet explorer has a bug and does not always send the submit value.
Okay. Lets try to clear the confusion up a bit first.
This error: The image "http://localhost/show_image.php?image=IMG_0188.JPG" cannot be displayed because it contains errors. indicates that the script show_image.php directly on your document root is pushing a header for an image (ie: header('Content-type: image/png'); for example). But the data within it is not deemed to be an image.
The script you have posted contains no such header, so it cannot be treated as an image. The error you receive I assume is when you try connecting to that address by typing it into the url (if you used an <img> tag, it should create one of the awesome broken link [x] boxes). Therefore, the script you have posted cannot be show_image.php, or at least not the show_image.php referred to directly off the document root.
The script you have has code that has the job to open a new window to show the image:
Code:
var url = "show_image.php?image=" + image;
// Create the pop-up window:
popup = window.open(url, "ImageWindow", specs);
Chances are that this page is not the same as the one you are requesting.
We're looking for the page that's job is to hand that $image passed to it. It appears that it should be show_image.php.
Before you post, read our: 
