Quick & Easy Ajax Web-Based File Uploader Script

Uber Uploader Progress Bar ScreenshotI am frequently asked by clients to set up a web page where their clients can upload files. These are often design firms who have to share files with printers and viceversa, and although the file transfer protocol was designed for this, it seems that FTP clients are not something that “most” people have, or know how to use.

Ajax File Transfer That Just Works!

Part of the problem is that no script works straight out of the box, and for the uninitiated it can be quite a battle to set something up and figure out why it is NOT working. You often find yourself stuck between bad file permissions or not being able to run perl scripts outside of the CGI-BIN folder in your HTML root.

In my internet travels, I came accross a great and easy to setup ajax file transfer script that allows users to queue and upload anything upto 10 files in one go, and which calculates the progress for each in turn.

The script in question is called Uber Uploader.

Getting Setup & Started

  1. To make the script function you need to start by downloading a copy and then transfering this into a web-accessbile folder on your Linux web server. On a CPanel server I would create a folder for the application under your “public_html” folder.
  2. Having uploaded the ZIP file, decompress the archive, making sure that the contents are then placed into the designated application folder, which for the purpose of this article we will call “file-uploader”.
  3. Move the ” ubr_pload.pl” file to your cgi-bin directory, adn set the permissions on it to 755.
  4. In the “file-uploader” directory you will need to create a “ubr_uploads” folder, if one does not exist and then set the permissions to 766 so that anything can read or write from it.
  5. Load up “ubr_file_upload.php” in your web browser, e.g. http://domain.com/file-uploader/ubr_file_upload.php and then attempt to upload a file < 5MB.

Configuring Uber Uploader

The basic set up is pretty restrictive, and understandabaly so, as you dont want to allow everyone and any one to have every which way with your server. You will most likely wish to do any or all of the following:

  • Restrict access to the “file-uploader” directory using a password via .htaccess files or using the password manager in CPanel.
  • Increase the maximum file size upload from 5MB to anything more appropriate by changing the calculation for the “max_upload_size” variable in the “ubr_default_config.php” file.
  • Add to the basic selection of permitted file upload extensions, for example, if you run a print shop, add psd, qxp, ai, pdf and more for the “allow_extensions” variable in the “ubr_default_config.php” file.

Beyond this, what you do is up to you.

Conclusion: Protect Your Assets

The great thing about Uber Uploader is that it is pretty agile and works pretty quick, out of the box. I had it up and running in about 5 minutes after I was able to download it from the UU project web site.

Don’t let the ease fool you though, make sure you only open access up as much as necessary and that you don’t allow all and sundry to upload an infinite amount of files to your server and max out your disk space.

That being said, do you know how much disk space you have left for the uploaded files? Time to find out!

Find out more at the Uber Uploader project site.

Bookmark This Article:
  • Digg
  • del.icio.us
  • Facebook
  • Google
  • Furl
  • LinkedIn
  • Live
  • Ma.gnolia
  • MySpace
  • Pownce
  • Reddit
  • StumbleUpon
  • Technorati
  • E-mail this story to a friend!
  • Print this article!
  • Yahoo! Buzz
  • YahooMyWeb

Leave a Reply