Previous pages have dealt with changing file contents but you can also upload whole files.

Open formandprocess.php and save it as fileupload.php.  It should still work because of the PHP_SELF bit but test it to be sure.

Structure

The first line of the if looks like this:

if (!$_POST) {

but change it to look for a file instead of posted data:

if (!$_FILES) {

Form

Replace the existing form with this one and note the extra attribute:

<form enctype="multipart/form-data" method="post" action="<?php echo $_SERVER["PHP_SELF"]; ?>">
    <p><input type="file" name="file01"></p>
    <p><input type="submit"></p>
</form>

The enctype attribute sets the type of data to be sent by the form. The other difference is the single input field which has a type of file which results in a button to launch the browser's file dialog.

The form lets the user choose a file and then the browser sends the chosen file to the server when the button is pressed.

Testing

Delete everything inside the else in fileupload.php (leave the braces to contain the new code).  That should be 5 lines which get the form data and echo it in a sentence.  Paste this in to replace them:

echo "<pre>";
    print_r($_FILES);
echo "</pre>";

Save the page and try to upload a file.  You should see some text describing what was uploaded (if not check your code).  Note that you can upload more than one file which is why the input field was given that name.  To add more files you would just add more input fields with different names.

Processing

Comment out the three lines (two echo lines and the print_r in the middle) as they were just to test the form.  Under them add this:

$oldname=$_FILES["file01"]["name"];
$tempname=$_FILES["file01"]["tmp_name"];
move_uploaded_file($tempname, $oldname);  

Try it by browsing to a file (small is good) and you should be able to upload the file to the server.  Be aware this is potentially dangerous as a user could upload anything including viruses.  More on that soon.  Use FTP to look on the server to check that the file made it (you may need to refresh the view).

When the form is submitted to the server the file is uploaded using special encoding. It is placed in a temporary location on the server and information about it is stored in $_FILES. The first two new lines of code set up some variables to remember the original file name and the temporary location.  The built-in PHP function move_uploaded_file() moves the temporary file to its intended location and renames it. 

Copy the input line in the form and paste it under itself to make two.  Change the name of the second one to file02.  Try the page and choose two files before pressing submit.  $_FILES is the superglobal which holds information about all files uploaded in the form. It is an associative array which holds a number of other arrays (each one of these holds information about a single file).

Improvements

You can improve this upload page a lot.  Replace the three lines currently processing the file with this:

$type=$_FILES["file01"]["type"];
$size=$_FILES["file01"]["size"];
$oldname=$_FILES["file01"]["name"];
$tempname=$_FILES["file01"]["tmp_name"];

if($size<=50000 && $type=="text/html") {
    if (move_uploaded_file($tempname, $oldname)){
        echo "<p>The file was uploaded successfully</p>";
    } else {
        echo "<p>Sorry, no good</p>";
    }
} else {
    echo "<p>Sorry that file cannot be uploaded.</p>";
}

You should be able to spot:

  • an if statement which only allows the upload if a file is less than a certain size and is a text HTML file (so no images, executables or videos)
  • an if/else statement which checks to see if the upload worked or not and gives a message in each case

Allowing uploads on your site is potentially dangerous as there is no control over what is uploaded or by who. By adding limits on the file size or type and allowing only logged on users to access the page risks can be reduced.  You can allow other file types as well (do a Web search for mime types). 

Other types of file

The above example only allows files of the type text/html.  If you want to allow images instead you will need something like this (change yours):

if($size<=150000 && ($type=="image/jpeg" || $type=="image/png" || $type=="image/gif")) {

If you want to allow other kinds of image file you will need to add more OR bits in the if condition.  Note that the file size was also increased a bit but even so large images will now not work.

An uploads folder

Given that the uploaded files could be dodgy you might want to keep them all together so you can treat them differently.  To do that add this line just after the existing line which starts $oldname

$oldname="./uploads/$oldname";
Try uploading two images and you should see two PHP warnings and your own error message.  To fix this create a folder called uploads inside intermediatesite.  Refresh the page and the images should upload this time.