Find all images in folder with Javascript

Question

Sorry If this is trivial,

Edit: in short I found out this really isn't intended to be done with client-side JavaScript.

I am wondering if i know a folder has pictures. /home/project1/pictures and they follow some naming convention face102039.jpg face1030303.jpg ...

Is there a was to know every picture thats in there starting with face but not knowing what numbers are after it? Like is there a way i could possibly grab all the file names with a .jpg or .png extension and then i would know how to parse their strings. I am just not sure how to get all the files in a directory with javascript.

I saw this similar post , and I know how to do what I want in Java, but i couldnt find a way to do this in javascript. I was thinking about doing it server side with java or ruby but I am pretty sure i should be able to do this clientside via javascript. Maybe I am wrong though.

Answer 1

Given the constraints it is technically possible to do this, just not very practical. I would not recommend using this since you could lock up the user's browser pretty quickly.

var len = 2000000;//How long you want to wait.
var pics=[];
for(var i=0;i<len;i++){
  a=new Image();
  a.onload=function(){
    pics.push(this);
  }
  a.src='/home/project1/pictures/face'+i+'.jpg';
}

The real answer is you need to implement a back end in PHP, RoR, etc. To send you a list of the files in the picture folder. This can be done with AJAX.

Answer 2

Javascript is running at the client side. For example in the browser of the visitor. It has no direct access to the server and image folders, as Java and php does.

What can be done is using ajax in the javascript, to fetch a java/php file which lists the directory content.

Answer 3

You can't access the file system with JavaScript . You could, however, use AJAX to query your server for that information and return it as a JSON string.

Hope this helps.