William Jiang

JavaScript,PHP,Node,Perl,LAMP Web Developer – http://williamjxj.com; https://github.com/williamjxj?tab=repositories

NodeJS & Express: Upload Images

NodeJS & Express: Upload Images

There is an excellent article showing to use Node.js and Express to upload file/image. For the upload form:

<form id="uploadForm"
    enctype="multipart/form-data"
    action="/api/photos"
    method="post">
 <input type="file" id="userPhotoInput" name="userPhoto" />
</form>

It uses setInterval call function, that is continually checking the value of the input element, once it has a value it can assume the user has selected a file and it will kick off the upload.

<script>
 var timerId;
   timerId = setInterval(function() {
   if($('#userPhotoInput').val() !== '') {
     clearInterval(timerId);
     $('#uploadForm').submit();
   }
 }, 500);
</script>

I can list many reasons that setInterval here is not a suitable solution. For general usage, I change it to onChange event:

$('#userPhotoInput').change(function(e) {
   e.preventDefault();
   //nothing to do if the upload field is null
   if($(this).val()=='' || /^\s+$/.test($(this).val()) return false;
   else $('#uploadForm').submit();
   return false;
 });

This way seems much better: when upload field changes, the changed file/image immediately uploaded, if null, nothing to upload.

Advertisements

One response to “NodeJS & Express: Upload Images

  1. Dre Beats 05/28/2012 at 11:12 am

    Great Distribute! good submit, when i absolutely really enjoy this site, keep on this!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: