www.webdeveloper.com
Page 1 of 23 12311 ... LastLast
Results 1 to 15 of 340

Thread: How to: Upload images using PHP

  1. #1
    Join Date
    Jan 2005
    Location
    Alicante (Spain)
    Posts
    7,742

    Arrow How to: Upload images using PHP

    How to upload images using PHP is one of the most frequently asked questions in this PHP forum so I am going to use this post to look at the basics.

    Uploading images can be broken down into the three following steps which will be looked at in turn:
    • An HTML form with a browse button to allow the client to choose which file to upload
    • A script to process the upload, validate the file, name it and place it in the file system
    • Lastly a page to advise the client the upload was a success


    Let's start with the HTML form.
    PHP Code:
    <?php

    // filename: upload.form.php

    // first let's set some variables

    // make a note of the current working directory relative to root.
    $directory_self str_replace(basename($_SERVER['PHP_SELF']), ''$_SERVER['PHP_SELF']);

    // make a note of the location of the upload handler script
    $uploadHandler 'http://' $_SERVER['HTTP_HOST'] . $directory_self 'upload.processor.php';

    // set a max file size for the html upload form
    $max_file_size 30000// size in bytes

    // now echo the html page
    ?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    <html lang="en">
        <head>
            <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
        
            <link rel="stylesheet" type="text/css" href="stylesheet.css">
            
            <title>Upload form</title>
        
        </head>
        
        <body>
        
        <form id="Upload" action="<?php echo $uploadHandler ?>" enctype="multipart/form-data" method="post">
        
            <h1>
                Upload form
            </h1>
            
            <p>
                <input type="hidden" name="MAX_FILE_SIZE" value="<?php echo $max_file_size ?>">
            </p>
            
            <p>
                <label for="file">File to upload:</label>
                <input id="file" type="file" name="file">
            </p>
                    
            <p>
                <label for="submit">Press to...</label>
                <input id="submit" type="submit" name="submit" value="Upload me!">
            </p>
        
        </form>
        
        
        </body>

    </html>
    The form is just basic HTML but has one very important part which is often accidently omitted making file uploads impossible. This item is contained in the <form> tag, be sure to include it:
    Code:
    <form id="Upload" action="<?php echo $uploadHandler ?>" enctype="multipart/form-data" method="post">
    The other important thing of course is the file <input> tag.
    Code:
    <input id="file" type="file" name="file">
    Lastly, while still on the subject of the upload form, it is possible to add an optional hidden <input> tag which contains the maximum upload filesize and this should come before the file upload field. The value of this field is the filesize in bytes.

    Now on to the upload processing script. This script runs in a linear way and if any step of the script is not satisfied the script will abort and output an error message. The comments in the script explain what each step does, and doesn't really require further explanation.
    PHP Code:
    <?php  

    // filename: upload.processor.php

    // first let's set some variables

    // make a note of the current working directory, relative to root.
    $directory_self str_replace(basename($_SERVER['PHP_SELF']), ''$_SERVER['PHP_SELF']);

    // make a note of the directory that will recieve the uploaded file
    $uploadsDirectory $_SERVER['DOCUMENT_ROOT'] . $directory_self 'uploaded_files/';

    // make a note of the location of the upload form in case we need it
    $uploadForm 'http://' $_SERVER['HTTP_HOST'] . $directory_self 'upload.form.php';

    // make a note of the location of the success page
    $uploadSuccess 'http://' $_SERVER['HTTP_HOST'] . $directory_self 'upload.success.php';

    // fieldname used within the file <input> of the HTML form
    $fieldname 'file';

    // Now let's deal with the upload

    // possible PHP upload errors
    $errors = array(=> 'php.ini max file size exceeded'
                    
    => 'html form max file size exceeded'
                    
    => 'file upload was only partial'
                    
    => 'no file was attached');

    // check the upload form was actually submitted else print the form
    isset($_POST['submit'])
        or 
    error('the upload form is neaded'$uploadForm);

    // check for PHP's built-in uploading errors
    ($_FILES[$fieldname]['error'] == 0)
        or 
    error($errors[$_FILES[$fieldname]['error']], $uploadForm);
        
    // check that the file we are working on really was the subject of an HTTP upload
    @is_uploaded_file($_FILES[$fieldname]['tmp_name'])
        or 
    error('not an HTTP upload'$uploadForm);
        
    // validation... since this is an image upload script we should run a check  
    // to make sure the uploaded file is in fact an image. Here is a simple check: 
    // getimagesize() returns false if the file tested is not an image.
    @getimagesize($_FILES[$fieldname]['tmp_name'])
        or 
    error('only image uploads are allowed'$uploadForm);
        
    // make a unique filename for the uploaded file and check it is not already
    // taken... if it is already taken keep trying until we find a vacant one
    // sample filename: 1140732936-filename.jpg
    $now time();
    while(
    file_exists($uploadFilename $uploadsDirectory.$now.'-'.$_FILES[$fieldname]['name']))
    {
        
    $now++;
    }

    // now let's move the file to its final location and allocate the new filename to it
    @move_uploaded_file($_FILES[$fieldname]['tmp_name'], $uploadFilename)
        or 
    error('receiving directory insuffiecient permission'$uploadForm);
        
    // If you got this far, everything has worked and the file has been successfully saved.
    // We are now going to redirect the client to a success page.
    header('Location: ' $uploadSuccess);

    // The following function is an error handler which is used 
    // to output an HTML error page if the file upload fails
    function error($error$location$seconds 5)
    {
        
    header("Refresh: $seconds; URL=\"$location\"");
        echo 
    '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"'."\n".
        
    '"http://www.w3.org/TR/html4/strict.dtd">'."\n\n".
        
    '<html lang="en">'."\n".
        
    '    <head>'."\n".
        
    '        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">'."\n\n".
        
    '        <link rel="stylesheet" type="text/css" href="stylesheet.css">'."\n\n".
        
    '    <title>Upload error</title>'."\n\n".
        
    '    </head>'."\n\n".
        
    '    <body>'."\n\n".
        
    '    <div id="Upload">'."\n\n".
        
    '        <h1>Upload failure</h1>'."\n\n".
        
    '        <p>An error has occured: '."\n\n".
        
    '        <span class="red">' $error '...</span>'."\n\n".
        
    '         The upload form is reloading</p>'."\n\n".
        
    '     </div>'."\n\n".
        
    '</html>';
        exit;
    // end error handler

    ?>
    If the script above came to its conclusion without any error the client will be redirected to a success (A.K.A. landing) page. The following is an example of such a page:
    PHP Code:
    <?php

    // filename: upload.success.php

    ?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    <html lang="en">
        <head>
            <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
            
            <link rel="stylesheet" type="text/css" href="stylesheet.css">
            
            <title>Successful upload</title>
        
        </head>
        
        <body>
        
            <div id="Upload">
                <h1>File upload</h1>
                <p>Congratulations! Your file upload was successful</p>
            </div>
        
        </body>

    </html>
    Finally to tie everything together we need a simple stylesheet:
    HTML Code:
    #Upload {
    	width: 25em;
    	margin: 1em auto;
    	padding:0 2em 2em 2em ;
    	border:1px solid #bbb;
    	color: #333;
    	background:#ffd;
    	font: 0.9em verdana, sans-serif;
    }
    			
    #Upload h1{
    	font: 1.4em bold verdana, sans-serif;
    	margin: 0;
    	padding:1em 0;
    	text-align:center;
    }
    #Upload label{
    	float: left;
    	width: 7em;
    }
    		
    #Upload p {
    	 clear: both;
    }		
    
    .red{
    	color:red;
    }
    Permissions: I'm not going to go into perrmissions in this article as it is a platform specific issue and also varies from server to server depending on the how the server has been configured. General speaking the files will be created 0644 but if that is not the case on your server you will need to chmod() them to at least this permission for them to be web viewable. For more information on the configuration of your particular server consult your host's FAQs.

    That's about it. I have put the whole thing in a zip file which contains all the directories and files needed and which will work without modification if uploaded to a server.

    If you are still unclear about image uploads please consider studying the following offical documentation before posting a question in the forum:
    Attached Files Attached Files
    Last edited by bokeh; 02-24-2006 at 04:26 AM.

  2. #2
    Join Date
    Jan 2005
    Location
    Alicante (Spain)
    Posts
    7,742

    How to: Multiple image uploads with PHP

    Multiple uploads are pretty much the same as simple uploads but with few subtle differences. This post looks at these differences.

    First the upload form:
    PHP Code:
    <?php

    // filename: upload.form.php

    // first let's set some variables

    // make a note of the current working directory relative to root.
    $directory_self str_replace(basename($_SERVER['PHP_SELF']), ''$_SERVER['PHP_SELF']);

    // make a note of the location of the upload handler
    $uploadHandler 'http://' $_SERVER['HTTP_HOST'] . $directory_self 'multiple.upload.processor.php';

    // set a max file size for the html upload form
    $max_file_size 30000// size in bytes

    // now echo the html page
    ?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    <html lang="en">
        <head>
            <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
        
            <link rel="stylesheet" type="text/css" href="stylesheet.css">
            
            <title>Upload form</title>
        
        </head>
        
        <body>
        
        <form id="Upload" action="<?php echo $uploadHandler ?>" enctype="multipart/form-data" method="post">
        
            <h1>
                Upload form
            </h1>
            
            <p>
                <input type="hidden" name="MAX_FILE_SIZE" value="<?php echo $max_file_size ?>">
            </p>
            
            <p>
                <label for="file1">File to upload:</label>
                <input id="file1" type="file" name="file[]">
            </p>
                    
            <p>
                <label for="file2">File to upload:</label>
                <input id="file2" type="file" name="file[]">
            </p>
                    
            <p>
                <label for="file3">File to upload:</label>
                <input id="file3" type="file" name="file[]">
            </p>
                    
            <p>
                <label for="submit">Press to...</label>
                <input id="submit" type="submit" name="submit" value="Upload us!">
            </p>
        
        </form>
        
        
        </body>

    </html>
    The form is almost identical to the simple upload form except it has multiple file <input> fields. Each <input> file is as follows:
    Code:
    <input id="file1" type="file" name="file[]">
    Note the square brackets following the field name; this tells PHP that it is an array of files rather than just a single file.

    Now the uploads processing script.
    It is possible to do this several ways; either the whole script can be looped for each file or we could loop each step of the script for each file. I have opted for the second method as this means nothing will have already been saved in the case of an error.
    PHP Code:
    <?php  

    // filename: upload.processor.php

    // first let's set some variables

    // make a note of the current working directory, relative to root.
    $directory_self str_replace(basename($_SERVER['PHP_SELF']), ''$_SERVER['PHP_SELF']);

    // make a note of the directory that will recieve the uploaded files
    $uploadsDirectory $_SERVER['DOCUMENT_ROOT'] . $directory_self 'uploaded_files/';

    // make a note of the location of the upload form in case we need it
    $uploadForm 'http://' $_SERVER['HTTP_HOST'] . $directory_self 'multiple.upload.form.php';

    // make a note of the location of the success page
    $uploadSuccess 'http://' $_SERVER['HTTP_HOST'] . $directory_self 'multiple.upload.success.php';

    // name of the fieldname used for the file in the HTML form
    $fieldname 'file';

    //echo'<pre>';print_r($_FILES);exit;



    // Now let's deal with the uploaded files

    // possible PHP upload errors
    $errors = array(=> 'php.ini max file size exceeded'
                    
    => 'html form max file size exceeded'
                    
    => 'file upload was only partial'
                    
    => 'no file was attached');

    // check the upload form was actually submitted else print form
    isset($_POST['submit'])
        or 
    error('the upload form is neaded'$uploadForm);
        
    // check if any files were uploaded and if 
    // so store the active $_FILES array keys
    $active_keys = array();
    foreach(
    $_FILES[$fieldname]['name'] as $key => $filename)
    {
        if(!empty(
    $filename))
        {
            
    $active_keys[] = $key;
        }
    }

    // check at least one file was uploaded
    count($active_keys)
        or 
    error('No files were uploaded'$uploadForm);
            
    // check for standard uploading errors
    foreach($active_keys as $key)
    {
        (
    $_FILES[$fieldname]['error'][$key] == 0)
            or 
    error($_FILES[$fieldname]['tmp_name'][$key].': '.$errors[$_FILES[$fieldname]['error'][$key]], $uploadForm);
    }
        
    // check that the file we are working on really was an HTTP upload
    foreach($active_keys as $key)
    {
        @
    is_uploaded_file($_FILES[$fieldname]['tmp_name'][$key])
            or 
    error($_FILES[$fieldname]['tmp_name'][$key].' not an HTTP upload'$uploadForm);
    }
        
    // validation... since this is an image upload script we 
    // should run a check to make sure the upload is an image
    foreach($active_keys as $key)
    {
        @
    getimagesize($_FILES[$fieldname]['tmp_name'][$key])
            or 
    error($_FILES[$fieldname]['tmp_name'][$key].' not an image'$uploadForm);
    }
        
    // make a unique filename for the uploaded file and check it is 
    // not taken... if it is keep trying until we find a vacant one
    foreach($active_keys as $key)
    {
        
    $now time();
        while(
    file_exists($uploadFilename[$key] = $uploadsDirectory.$now.'-'.$_FILES[$fieldname]['name'][$key]))
        {
            
    $now++;
        }
    }

    // now let's move the file to its final and allocate it with the new filename
    foreach($active_keys as $key)
    {
        @
    move_uploaded_file($_FILES[$fieldname]['tmp_name'][$key], $uploadFilename[$key])
            or 
    error('receiving directory insuffiecient permission'$uploadForm);
    }
        
    // If you got this far, everything has worked and the file has been successfully saved.
    // We are now going to redirect the client to the success page.
    header('Location: ' $uploadSuccess);

    // make an error handler which will be used if the upload fails
    function error($error$location$seconds 5)
    {
        
    header("Refresh: $seconds; URL=\"$location\"");
        echo 
    '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"'."\n".
        
    '"http://www.w3.org/TR/html4/strict.dtd">'."\n\n".
        
    '<html lang="en">'."\n".
        
    '    <head>'."\n".
        
    '        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">'."\n\n".
        
    '        <link rel="stylesheet" type="text/css" href="stylesheet.css">'."\n\n".
        
    '    <title>Upload error</title>'."\n\n".
        
    '    </head>'."\n\n".
        
    '    <body>'."\n\n".
        
    '    <div id="Upload">'."\n\n".
        
    '        <h1>Upload failure</h1>'."\n\n".
        
    '        <p>An error has occured: '."\n\n".
        
    '        <span class="red">' $error '...</span>'."\n\n".
        
    '         The upload form is reloading</p>'."\n\n".
        
    '     </div>'."\n\n".
        
    '</html>';
        exit;
    // end error handler

    ?>
    Pretty much everything else is the same as in a case of a simple upload.

    As before a zip file has been added. This is a full working version.
    Attached Files Attached Files
    Last edited by bokeh; 03-01-2006 at 11:55 AM.

  3. #3
    Join Date
    Feb 2005
    Location
    Tauranga
    Posts
    2,062
    Very Very nice, Hopefully now to stop those mulitudes of questions by all the newbies


    Nice work Bokeh!!!!

  4. #4
    Join Date
    Feb 2005
    Location
    BC, Canada
    Posts
    1,098
    Oh bokeh, how I love you and your noob-spam-reducing ways.

    That came out kinda sarcastically sounding, but it's true. Keep up the good work.
    Corn is no place for a mighty warrior!

  5. #5
    Join Date
    Jan 2005
    Location
    Alicante (Spain)
    Posts
    7,742
    Quote Originally Posted by SpectreReturns
    Oh bokeh, how I love you and your noob-spam-reducing ways.

    That came out kinda sarcastically sounding, but it's true. Keep up the good work.
    Which bit did you mean?

  6. #6
    Join Date
    Jun 2004
    Location
    4846′36″ N 910′48″ E
    Posts
    3,747
    nice!

  7. #7
    Join Date
    Aug 2004
    Location
    San Antonio, TX
    Posts
    564
    @Bokeh - sweetness!

    @Newbie bashers -

    *Steps upon the high chair*

    We're all newbies in some form or another, just remember how you felt coming up?

    *Steps down and sighs*

    Answers to all your questions can be found at: PHP Manual

  8. #8
    Join Date
    Feb 2005
    Location
    Tauranga
    Posts
    2,062
    Quote Originally Posted by SpectreReturns
    Oh bokeh, how I love you and your noob-spam-reducing ways.

    That came out kinda sarcastically sounding, but it's true. Keep up the good work.

    Hehe Good call! I like it

  9. #9
    Join Date
    Aug 2004
    Location
    San Antonio, TX
    Posts
    564
    OK, I give up!

    If a user doesn't load a file and just presses the submit button, I get this:

    Code:
    Warning: Invalid argument supplied for foreach() in C:\...\upload_processor.php on line 52
    
    Warning: Invalid argument supplied for foreach() in C:\...\upload_processor.php on line 59
    
    Warning: Invalid argument supplied for foreach() in C:\...\upload_processor.php on line 67
    
    Warning: Invalid argument supplied for foreach() in C:\...\upload_processor.php on line 75
    
    Warning: Invalid argument supplied for foreach() in C:\...\upload_processor.php on line 85
    
    Warning: Cannot modify header information - headers already sent by (output started at C:\...\upload_processor.php:52) in C:\...\upload_processor.php on line 93
    Last edited by rch10007; 03-01-2006 at 03:37 AM.

    Answers to all your questions can be found at: PHP Manual

  10. #10
    Join Date
    Jan 2005
    Location
    Alicante (Spain)
    Posts
    7,742
    Quote Originally Posted by rch10007
    If a user doesn't load a file and just presses the submit button, I get this:
    That's the multiple uploader, right? Anyway I've edited that now; just that the array wasn't initialised.

  11. #11
    Join Date
    Feb 2005
    Location
    BC, Canada
    Posts
    1,098
    Quote Originally Posted by bokeh
    Which bit did you mean?
    I just meant with the whole "there's lots of threads like this, so I'll answer 'em all at once" type thing.

    Quote Originally Posted by rch10007
    We're all newbies in some form or another, just remember how you felt coming up?
    Indeed, I do remember being a newbie, but I'd usually* search for an answer before I posted.

    * I can't remember any time I didn't, but it's best to play it safe.
    Last edited by SpectreReturns; 03-01-2006 at 09:05 PM. Reason: Gramatical errors
    Corn is no place for a mighty warrior!

  12. #12
    Join Date
    Oct 2005
    Posts
    843
    nevermind, found the answer to my own question
    Last edited by welsh; 03-01-2006 at 08:50 PM.
    Welsh

  13. #13
    Join Date
    Aug 2004
    Location
    San Antonio, TX
    Posts
    564
    Quote Originally Posted by bokeh
    That's the multiple uploader, right? Anyway I've edited that now; just that the array wasn't initialised.
    Sorry I wasn't more descriptive when I wrote the previous posts. I was at the end of a 22 hour day so I wasn't very coherent.

    Yes, you did fix the problem. I will keep testing so that we can ensure a bug free app. You did a damn fine job at coding that BTW!

    Answers to all your questions can be found at: PHP Manual

  14. #14
    Join Date
    Oct 2005
    Posts
    843
    yea works like a charm, easily adaptable to make a log with mysql.
    Welsh

  15. #15
    Join Date
    Feb 2006
    Posts
    7

    how to read csv file

    hello everybody,

    i want help i have a csv file

    Name,E-mail Address,Notes,E-mail 2,E-mail 3,Mobile Phone,Pager,Company,Job Title,Home Phone,Home Phone 2,Home Fax,Home Address,Business Phone,Business Phone 2,Business Fax,Business Address,Other Phone,Other Fax,Other Address
    Test Name ,Test@mail.com,,,,,,,,,,,,,,,,,,

    i want to store first line of csv file as Name,E-mail Address ........Other Address
    As $Name ,
    $E-mail Address,
    .....$Other Address,

    And second line of the file Test Name ,Test@mail.com,,,,,,,,,,,,,,,,,,



    As $Name =Test Name;
    ..

    DEVPPL

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles