This tutorial explains the basics of uploading images or files to your server using a HTML form and the PHP function copy. I haven't explained form validation or file checking - I'll go into further detail on that in future tutorials. To kick things off, you'll need a HTML form:
uploadform.htm
<html>
<head>
<title>HTML Form for uploading image to server</title>
</head>
<body>
<form name="upload" method="post" action="uploadresults.php" enctype="multipart/form-data">
<input type="file" name="Image"><br>
<input type="submit" value="Upload Image">
</form>
</body>
</html>
There are two things to note about the HTML code. Firstly, I've defined the attribute enctype="multipart/form-data" in the form tag. This encodes your form data differently to normal, allowing you to submit files. Secondly, I've used the input element with type = "file". The browser renders this as follows:
Note the 'Browse...' button. Clicking this opens a window allowing the user to browse their local computer and select a file (go on, try it). Once they've selected a file and clicked 'Open', the window closes and the file's local path appears in the form (eg - "C:\My Documents\button.gif"). Clicking 'Upload Image' (eg - the submit button) sends the form results, including the local file, to uploadresults.php for processing:
uploadresults.php
<?php
copy ($_FILES['Image']['tmp_name'], $_FILES['Image']['name']) or die ('Could not upload');
?>
The uploaded image is stored on the server in a temporary location. You can reference it by using the global array $_FILES. There are several variables available:
$_FILES['file']['name']: name of the file
$_FILES['file']['type']: filetype of the uploaded file
$_FILES['file']['size']: size of the uploaded file (in bytes)
$_FILES['file']['tmp_name']: name for the temporary file stored on the server
$_FILES['file']['error']: an error code resulting from the file transfer
Once uploadresults.php has finished executing, the temporary file is deleted. You use the PHP function copy to store the file in a permanent location. Copy has two arguments - the first is the temporary location, the second is the final destination where you wish to save the file. In the example above, I saved the file in the same directory as uploadresults.php. If I wanted to save it in a subdirectory, I'd have used something like this:
<?php
copy ($_FILES['Image']['tmp_name'], "images/".$_FILES['Image']['name']) or die ('Could not upload');
?>
So there you have it. There are checks you can perform on uploaded files to ensure they're the right size, filetype, etc. In fact, I'd strongly recommend you have some checks in place, particularly if your upload form is open to the public. For example, you can specify a maximum size of the uploaded file (which importantly kicks in before the file is uploaded). You can check the filetype to make sure it's a certain type. You can even resize images to create thumbnails on the fly. I'll cover all of these in future tutorials so stay tuned. :-)
