Results 1 to 5 of 5

Thread: making a handy image uploader for family

  1. #1
    Join Date
    Dec 2011
    Posts
    49
    Thanks
    8
    Thanked 1 Time in 1 Post

    Default making a handy image uploader for family

    hey guys, brand new here.

    before i go on let me say that,
    i searched the forums for my problem but the latest thread with any remotely similar issues was in like 2007.

    i'm making an image uploader for my family on my server, so we have a nice place to look through all our pictures on the fly.

    i've snooped around a bit and slapped this little thing together. so far it takes an image, renames it with a randomly generated number, and uploads it to the folder of my choosing. i've included my problems and comments as comments in the code:

    Code:
    <?php
    if ((($_FILES["file"]["type"] == "image/gif")
    || ($_FILES["file"]["type"] == "image/jpeg")
    || ($_FILES["file"]["type"] == "image/pjpeg"))
    && ($_FILES["file"]["size"] < 2000000))
    /* so from the above you see it only takes jpeg or gifs, 
    but i want it to take all image types, and rather than listing them 
    all i want to use this clever bit i found in another example,
     
    $image_size = getimagesize($_FILES['file']['tmp_name']);
    
     if ($image_size==FALSE)
            echo "that's not an image.";
    else
    {
    this would save a lot of lines and make it more dynamic, it would just check 
    if the file has an image size, if not it would just kick it out.
    but i'm having trouble implementing it. i figure i have to define $image 
    first right? how would i define $image as the image? i would put the 
    ending brace for the else statement at the bottom just before the php 
    close tag.(not sure if that's right either, but it doesn't work :/)
    anyway it goes,
    */
      {
      if ($_FILES["file"]["error"] > 0)
        {
        echo "Return Code: " . $_FILES["file"]["error"] . "<br />";
       /*btw i set the image size limit at 2mb for now, but if i change this 
    echo to something like "your image is over 2MB reduce it and try again!" 
    it doesn't display the message. i have no idea why not...
    */
        }
      else
        {
           //here the image name splits from the extension and is renamed, then reconnected.
            function findexts ($filename) { 
            $filename = strtolower($filename) ; 
            $exts = split("[/\\.]", $filename) ; 
            $n = count($exts)-1; 
            $exts = $exts[$n]; return $exts; 
            } 
            $ext = findexts ($_FILES['file']['name']) ; 
             $ran = rand () ; 
             $ran2 = $ran."."; 
             $target = "random/";
    
             $target = $target . $ran2.$ext; 
            
        echo "Upload: " . $_FILES["file"]["name"] . "<br />";
        echo "Type: " . $_FILES["file"]["type"] . "<br />";
        echo "Size: " . ($_FILES["file"]["size"] / 1024) . " Kb<br />";
        echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br />";
    
        if (file_exists("random/" . $ran2.$ext))
          {
          echo $ran2.$ext . " already exists. ";
          /*also i know this is retarded, but i'm still trying to figure out how to put a 
    while loop here so it renames the image again in case of a same name.
          i figure it's something like:
    while(file_exists("random/" . $ran2.$ext))
    {
             $ran = rand () ; 
             $ran2 = $ran."."; 
             $target = "random/";
      $target = $target . $ran2.$ext; 
    }
    but i'm not entirely sure if that will work. kind of hard to test it when a 
    random number is generated everytime lol
    */
          }
        else
          {
          move_uploaded_file($_FILES["file"]["tmp_name"], $target);
          echo "Stored in: " . "mything.com/random/" .$ran2.$ext;
          } 
        }
      }
    else
      {
      echo "Invalid file";
    /*this echo comes up even on page load, before an image is even chosen
     or uploaded. i'm sure it would cause mass confusion but i'm still trying to 
    figure out how to fix this. maybe i should just change it to 'ready for image
     upload' since i have that other error catch in place.
    */ 
     }
    ?>
    another concern is when the page is refreshed, it asks to resend data, how can i eliminate this request? i would just want the uploader to be reset, otherwise a duplicate is sent everytime the page is reloaded or the back button is hit once leaving the page. i read that i can use a javascript redirect, but when i try implementing the couple i've found it doesn't work or the page doesn't even load. i also read that 'session' can be used, but i'm trying to figure that out.

    any ideas? i know it's a big mess, but that's why i'm looking for some guidance, my php is lacking x.x
    Last edited by baconDelta; 12-22-2011 at 10:37 PM.

  2. #2
    Join Date
    Jul 2010
    Location
    Minnesota
    Posts
    256
    Thanks
    1
    Thanked 21 Times in 21 Posts

    Default

    I would take a look at this youtube channel - http://youtube.com/betterphp
    This guy is very good at security and his coding skills are top notch. He has a few videos on file upload so search for those and you should be good. The whole thing about resending data with page refresh, one smart way is after all the validation passes and you move the files use the header() to redirect back to the page you want. That will eliminate your issue. If you want to display the file info from the upload, before you do the redirect put the info into some session vars or GET vars in the url and then you can access them in the new page.

  3. #3
    Join Date
    Dec 2011
    Posts
    49
    Thanks
    8
    Thanked 1 Time in 1 Post

    Default

    mighty fine resource thanks! i'll scour his vids for it. yeah i've had trouble getting the header () to work. i know that you can't output anything to the page if you're going to direct away from it, but it still doesn't redirect for me. i'll experiment a bit and look up your terminology but thanks for the informative post in case anyone is interested i've updated the code a bit. i made the pictures name count up from 0 instead of just giving a random number, so the while loop works. i'm still trying to figure out how to use
    PHP Code:
    getimagesize($_FILES['image']['tmp_name']); 
    to seperate images from non-images instead of listing all the extensions the uploader approves. one thing i've noticed is that it has issues with certain gifs, no idea why. here's the updated code, it's a lot cleaner:

    PHP Code:
    <?php
    if ((($_FILES["file"]["type"] == "image/gif")
    || (
    $_FILES["file"]["type"] == "image/jpeg")
    || (
    $_FILES["file"]["type"] == "image/pjpeg")
    || (
    $_FILES["file"]["type"] == "image/png"))
    && (
    $_FILES["file"]["size"] < 2000000))
      {
      if (
    $_FILES["file"]["error"] > 0)
        {
        echo 
    "Return Code: " $_FILES["file"]["error"] . "<br />";
        }
      else
        {
        function 
    findexts ($filename) { 
        
    $filename strtolower($filename) ; 
        
    $exts split("[/\\.]"$filename) ; 
        
    $n count($exts)-1
        
    $exts $exts[$n]; return $exts
        } 
     
        
    $ext findexts ($_FILES['file']['name']) ; 
        
         
    $ran 
         
    $ran2 $ran."."
         
    $target "random/";

         
    $target $target $ran2.$ext
        
        echo 
    "Upload: " $_FILES["file"]["name"] . "<br />";
        echo 
    "Type: " $_FILES["file"]["type"] . "<br />";
        echo 
    "Size: " . ($_FILES["file"]["size"] / 1024) . " Kb<br />";
        echo 
    "Temp file: " $_FILES["file"]["tmp_name"] . "<br />";

        if (
    file_exists("random/" $ran2.$ext))
          {
          while(
    file_exists("random/" $ran2.$ext))
            {
             
    $ran++; 
             
    $ran2 $ran."."
             
    $target "random/";
            
    $target $target $ran2.$ext
           }  
          
    move_uploaded_file($_FILES["file"]["tmp_name"], $target);
          echo 
    "Stored in: " "mywebsite.com/random/" .$ran2.$ext;
          }
        else
          {
          
    move_uploaded_file($_FILES["file"]["tmp_name"], $target);
          echo 
    "Stored in: " "mywebsite.com/random/" .$ran2.$ext;
           } 
        }
      }
    else
      {
      echo 
    "Upload Time";
      }
    ?>
    Last edited by baconDelta; 01-02-2012 at 04:49 PM. Reason: switching code tags to php tags

  4. #4
    Join Date
    Dec 2011
    Posts
    49
    Thanks
    8
    Thanked 1 Time in 1 Post

    Default

    sweet i got it working. now the code takes the uploaded image and makes a new page for it with the same name as the image. the image is shown in a nice template with a title box that i made on the upload page. now all i have to figure out is how to link the latest page to the rest in the folder, so that they can be scrolled through.

    edit: after a little looking around it seems like i can scroll to the next page with the readdir() function. it might be tricky getting it to work with placeholders and the template page for freshly uploaded pics.
    Last edited by baconDelta; 12-28-2011 at 10:28 PM.

  5. #5
    Join Date
    Dec 2011
    Posts
    49
    Thanks
    8
    Thanked 1 Time in 1 Post

    Default

    just a quick update.

    i got the page to redirect successfully.

    just to reiterate the problem was that the upload page would not redirect once the image was uploaded and new page created.

    i fixed this by turning on output buffering for the process of the upload. my upload page looked like this,

    PHP Code:
    <html>
    <head>blah blah</head>
    <body>
    submit form is here.
    <?php 

        
    include("functions/image_upload.php");

    ?>
    </body>
    </html>
    so what i did is just go to image_upload.php and put my header at the very end.

    then i came back to the upload page and wrapped the whole thing in output buffer tags, so that the page was flushed once everything on it was executed. and since i put the redirect header at the bottom of that image_upload.php this means the image is uploaded AND the header redirect is hit BEFORE it's passed to the browser. so the user is directed to the new page just after it's been made. pretty snazzy.

    so now the upload page looks like this:
    PHP Code:
    <?php ob_start(); ?>
    <html>
    <head>blah blah</head>
    <body>
    submit form is here. choose file and such.
    <?php 

        
    include("functions/image_upload.php");

    ?>
    </body>
    </html>
    <?php ob_end_flush(); ?>
    i'm fairly certain the output buffer has to be started before any html or whitespace. as soon as even whitespace is passed, the browser starts processing the page and won't accept a header as it's already doing something.

    one important aspect to this working is that at the very top of my image_upload.php i have this:
    PHP Code:
    if(!$_POST)
    {
        break;
    }
    else{
    the actual upload code
    so until something is even posted(image is chosen and upload button is hit), the upload code, and the header redirect won't be processed, keeping the user on the upload page. that is if there is no post(!$_POST) then it breaks out of my code.

    and now when someone hits back after they've been redirected there's no asking for resending of data ^_^

    edit: something else just hit me, i need to put a safeguard in to not redirect the user if the upload is not successful. for instance if someone picks a text file, even though it's not successfully uploaded, it will still attempt to redirect. this can be done with a simple if else statement.

    edit2: so it seems an if else statement doesn't affect the redirecting. it's not really a big deal as it redirects to the folder's index on failure.

    so now i'm on to getting my 'next' and 'previous' buttons working, so that when gramma lands on her freshly uploaded picture, she can hit next or previous, and see other pictures in the album.

    still trying to figure out how to do that, if anyone has ideas pitch em
    Last edited by baconDelta; 01-02-2012 at 04:50 PM. Reason: see edit and edit2

Bookmarks

Posting Permissions

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