Convert a directory structure in the filesystem to JSON with Node.js

Javascriptnode.jsd3.jsFilesystems

Javascript Problem Overview


I have a file structure like this:

root
|_ fruits
|___ apple
|______images
|________ apple001.jpg
|________ apple002.jpg
|_ animals
|___ cat
|______images
|________ cat001.jpg
|________ cat002.jpg

I would like to, using Javascript and Node.js, listen to this root directory and all sub directories and create a JSON which mirrors this directory structure, each node contains type, name, path, and children:

data = [
  {
    type: "folder",
    name: "animals",
    path: "/animals",
    children: [
      {
        type: "folder",
        name: "cat",
        path: "/animals/cat",
        children: [
          {
            type: "folder",
            name: "images",
            path: "/animals/cat/images",
            children: [
              {
                type: "file",
                name: "cat001.jpg",
                path: "/animals/cat/images/cat001.jpg"
              }, {
                type: "file",
                name: "cat001.jpg",
                path: "/animals/cat/images/cat002.jpg"
              }
            ]
          }
        ]
      }
    ]
  }
];

Here's a coffeescript JSON:

data = 
[
  type: "folder"
  name: "animals"
  path: "/animals"
  children  :
    [
      type: "folder"
      name: "cat"
      path: "/animals/cat"
      children:
        [
          type: "folder"
          name: "images"
          path: "/animals/cat/images"
          children: 
            [
              type: "file"
              name: "cat001.jpg"
              path: "/animals/cat/images/cat001.jpg"
            , 
              type: "file"
              name: "cat001.jpg"
              path: "/animals/cat/images/cat002.jpg"
            ]
        ]
    ]
]

how to get this json data format in django views?(python)

Javascript Solutions


Solution 1 - Javascript

Here's a sketch. Error handling is left as an exercise for the reader.

var fs = require('fs'),
	path = require('path')

function dirTree(filename) {
	var stats = fs.lstatSync(filename),
		info = {
			path: filename,
			name: path.basename(filename)
		};

	if (stats.isDirectory()) {
		info.type = "folder";
		info.children = fs.readdirSync(filename).map(function(child) {
			return dirTree(filename + '/' + child);
		});
	} else {
		// Assuming it's a file. In real life it could be a symlink or
		// something else!
		info.type = "file";
	}

	return info;
}

if (module.parent == undefined) {
    // node dirTree.js ~/foo/bar
    var util = require('util');
	console.log(util.inspect(dirTree(process.argv[2]), false, null));
}

Solution 2 - Javascript

there's an NPM Module for it

https://www.npmjs.com/package/directory-tree

Creates an object representing a directory tree.

From:

photos
├── summer
│   └── june
│       └── windsurf.jpg
└── winter
    └── january
        ├── ski.png
        └── snowboard.jpg

To:

{
  "path": "",
  "name": "photos",
  "type": "directory",
  "children": [
    {
      "path": "summer",
      "name": "summer",
      "type": "directory",
      "children": [
        {
          "path": "summer/june",
          "name": "june",
          "type": "directory",
          "children": [
            {
              "path": "summer/june/windsurf.jpg",
              "name": "windsurf.jpg",
              "type": "file"
            }
          ]
        }
      ]
    },
    {
      "path": "winter",
      "name": "winter",
      "type": "directory",
      "children": [
        {
          "path": "winter/january",
          "name": "january",
          "type": "directory",
          "children": [
            {
              "path": "winter/january/ski.png",
              "name": "ski.png",
              "type": "file"
            },
            {
              "path": "winter/january/snowboard.jpg",
              "name": "snowboard.jpg",
              "type": "file"
            }
          ]
        }
      ]
    }
  ]
}

##Usage

var tree = directoryTree('/some/path');

And you can also filter by extensions:

var filteredTree = directoryTree('/some/path', ['.jpg', '.png']);

Solution 3 - Javascript

The accepted answer works, but it is synchronous and will deeply hurt your performance, especially for large directory trees.
I highly encourage you to use the following asynchronous solution, it is both faster and non-blocking.
Based on the parallel solution here.

var fs = require('fs');
var path = require('path');

var diretoryTreeToObj = function(dir, done) {
    var results = [];

    fs.readdir(dir, function(err, list) {
        if (err)
            return done(err);

        var pending = list.length;

        if (!pending)
            return done(null, {name: path.basename(dir), type: 'folder', children: results});

        list.forEach(function(file) {
            file = path.resolve(dir, file);
            fs.stat(file, function(err, stat) {
                if (stat && stat.isDirectory()) {
                    diretoryTreeToObj(file, function(err, res) {
                        results.push({
                            name: path.basename(file),
                            type: 'folder',
                            children: res
                        });
                        if (!--pending)
                            done(null, results);
                    });
                }
                else {
                    results.push({
                        type: 'file',
                        name: path.basename(file)
                    });
                    if (!--pending)
                        done(null, results);
                }
            });
        });
    });
};

Example usage:

var dirTree = ('/path/to/dir');

diretoryTreeToObj(dirTree, function(err, res){
    if(err)
        console.error(err);

    console.log(JSON.stringify(res));
});

Solution 4 - Javascript

My CS example (w/ express) based on Miika's solution:

fs = require 'fs' #file system module
path = require 'path' # file path module

# returns json tree of directory structure
tree = (root) ->
	# clean trailing '/'(s)
	root = root.replace /\/+$/ , ""
	# extract tree ring if root exists
	if fs.existsSync root
		ring = fs.lstatSync root
	else
		return 'error: root does not exist'
	# type agnostic info
	info = 
		path: root
		name: path.basename(root)
	# dir	
	if ring.isDirectory()
		info.type = 'folder'
		# execute for each child and call tree recursively
		info.children = fs.readdirSync(root) .map (child) ->
			tree root + '/' + child
	# file
	else if ring.isFile()
		info.type = 'file'
	# link
	else if ring.isSymbolicLink()
		info.type = 'link'
	# other
	else
		info.type = 'unknown'
	# return tree 
	info

# error handling
handle = (e) ->
	return 'uncaught exception...'
	
exports.index = (req, res) ->
	try
		res.send tree './test/'
	catch e
		res.send handle e

Solution 5 - Javascript

Here is an async solution:

 function list(dir) {
   const walk = entry => {
     return new Promise((resolve, reject) => {
       fs.exists(entry, exists => {
         if (!exists) {
           return resolve({});
         }
         return resolve(new Promise((resolve, reject) => {
           fs.lstat(entry, (err, stats) => {
             if (err) {
               return reject(err);
             }
             if (!stats.isDirectory()) {
               return resolve({
                 // path: entry,
                 // type: 'file',
                 name: path.basename(entry),
                 time: stats.mtime,
                 size: stats.size
               });
             }
             resolve(new Promise((resolve, reject) => {
               fs.readdir(entry, (err, files) => {
                 if (err) {
                   return reject(err);
                 }
                 Promise.all(files.map(child => walk(path.join(entry, child)))).then(children => {
                   resolve({
                     // path: entry,
                     // type: 'folder',
                     name: path.basename(entry),
                     time: stats.mtime,
                     entries: children
                   });
                 }).catch(err => {
                   reject(err);
                 });
               });
             }));
           });
         }));
       });
     });
   }

   return walk(dir);
 }

Note that when a directory does not exist, an empty result is returned rather than an error being thrown.

Here is a sample result:

{
    "name": "root",
    "time": "2017-05-09T07:46:26.740Z",
    "entries": [
        {
            "name": "book.txt",
            "time": "2017-05-09T07:24:18.673Z",
            "size": 0
        },
        {
            "name": "cheatsheet-a5.pdf",
            "time": "2017-05-09T07:24:18.674Z",
            "size": 262380
        },
        {
            "name": "docs",
            "time": "2017-05-09T07:47:39.507Z",
            "entries": [
                {
                    "name": "README.md",
                    "time": "2017-05-08T10:02:09.651Z",
                    "size": 19229
                }
            ]
        }
    ]
}

which will be:

root
|__ book.txt
|__ cheatsheet-a5.pdf
|__ docs
      |__ README.md

Solution 6 - Javascript

You can use the code from this project but you should adapt the code to your needs:

https://github.com/NHQ/Node-FileUtils/blob/master/src/file-utils.js#L511-L593

From:

a
|- b
|  |- c
|  |  |- c1.txt
|  |
|  |- b1.txt
|  |- b2.txt
|
|- d
|  |
|
|- a1.txt
|- a2.txt

To:

{
	b: {
		"b1.txt": "a/b/b1.txt",
		"b2.txt": "a/b/b2.txt",
		c: {
			"c1.txt": "a/b/c/c1.txt"
		}
	},
	d: {},
	"a2.txt": "a/a2.txt",
	"a1.txt": "a/a1.txt"
}

Doing:

new File ("a").list (function (error, files){
    //files...
});

Solution 7 - Javascript

I used 'walk' lib in this case, it gets your root path and walks over files and over directories recursively and emits an event of directory / file with all the info you need from a node, check out that implementation -->

const walk = require('walk');

class FsTree {

    constructor(){

    }

    /**
     * @param rootPath
     * @returns {Promise}
     */
    getFileSysTree(rootPath){
        return new Promise((resolve, reject)=>{

            const root = rootPath || __dirname; // if there's no rootPath use exec location
            const tree = [];
            const nodesMap = {};
            const walker  = walk.walk(root, { followLinks: false}); // filter doesn't work well

            function addNode(node, path){
                if ( node.name.indexOf('.') === 0 || path.indexOf('/.') >= 0){ // ignore hidden files
                    return;
                }
                var relativePath = path.replace(root,'');

                node.path = relativePath + '/' + node.name;
                nodesMap[node.path] = node;

                if ( relativePath.length === 0 ){ //is root
                    tree.push(node);
                    return;
                }
                node.parentPath = node.path.substring(0,node.path.lastIndexOf('/'));
                const parent = nodesMap[node.parentPath];
                parent.children.push(node);

            }

            walker.on('directory', (path, stats, next)=>{
                addNode({ name: stats.name, type:'dir',children:[]}, path);
                next();
            });

            walker.on('file', (path,stats,next)=>{
                addNode({name:stats.name, type:'file'},path);
                next();
            });

            walker.on('end',()=>{
                resolve(tree);
            });

            walker.on('errors',  (root, nodeStatsArray, next) => {
                reject(nodeStatsArray);
                next();
            });
        });

    }
}


const fsTreeFetcher = new FsTree();

fsTreeFetcher.getFileSysTree(__dirname).then((result)=>{
    console.log(result);
});

Solution 8 - Javascript

Adding up on Sean C.'s answer.

I quite like it, but using async await makes it much more readable.

import fs from 'fs';
import {
  lstat,
  readdir,
  access,
} from 'fs/promises';
import path from 'path';

async function existsAsync(file) {
  try {
    await access(file, fs.constants.F_OK);
    return true;
  } catch (e) {
    return false;
  }
}

async function listFileTreeRecursive(dir) {
  const recurse = async (entry) => {
    if (!(await existsAsync(entry))) {
      return {};
    }

    const stats = await lstat(entry);
    if (!stats.isDirectory()) {
      return {
        name: path.basename(entry),
        time: stats.mtime,
        size: stats.size,
      };
    }

    const files = await readdir(entry);
    const childEntries = await Promise.all(
      files.map((child) => recurse(path.join(entry, child))),
    );
    return {
      name: path.basename(entry),
      time: stats.mtime,
      entries: childEntries,
    };
  };

  return recurse(dir);
}

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionhagopeView Question on Stackoverflow
Solution 1 - JavascriptMiikkaView Answer on Stackoverflow
Solution 2 - JavascriptAsaf KatzView Answer on Stackoverflow
Solution 3 - JavascriptLifeQueryView Answer on Stackoverflow
Solution 4 - JavascriptfoolingView Answer on Stackoverflow
Solution 5 - JavascriptSean C.View Answer on Stackoverflow
Solution 6 - JavascriptGabriel LlamasView Answer on Stackoverflow
Solution 7 - Javascriptliron_hazanView Answer on Stackoverflow
Solution 8 - JavascriptOmar OmeiriView Answer on Stackoverflow