Как получить список файлов в папке и записать их в JSON с помощью js?

Question

[Иван Шашков]

В проекте есть папка с изображениями. Можно ли при загрузке страницы просканировать эту папку и вписать имена всех изображений в файл JSON?

Answer 1

[Надим]

zombtron разумеется можно. Просто выполните в консоли браузера:

input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('webkitdirectory', 'true');

input.addEventListener('change', function() {
	
	files = [];
	
	for (var num = 0; num < input.files.length; num++) {
		
		files.push(input.files[num].name);
		
	}
	
	console.log('Список имен файлов получен:');
	console.dir(files);

});

input.click();

Выберите папку, которую надо просканировать и получите на выходе список файлов.

Comments

[zombtron]

Выберите папку, которую надо просканировать и получите на выходе список файлов.

На сервере?
А на локалке можно и средствами браузера вывести для посмотреть... )

[Надим]

zombtron, на фронте в браузере)

[zombtron]

А чем
<object data="file:///C:/"></object>
не фронт? )))

[Иван Шашков]

А можно изначально в коде указать путь, без ручного выбора папки?

[Надим]

Иван Шашков, нельзя. У браузера нет прямого доступа к файлам на диске - нужно обязательное явное разрешение пользователя на просмотр папки.

P. S. Просто представьте на секунду, что вы заходите на какой-нибудь сайт, а тот берет и без спроса выкачивает все ваши личные файлы из папки Мои документы (допустим). Чтобы не было таких злоупотреблений и нужно явное разрешение.

[Иван Шашков]

Надим Закиров, так нет, я похоже неправильно выразился, в папке самого проекта, то-есть не локальные файлы, а те, которые на хостинге в папке рядом с index.html лежат.

[Надим]

Иван Шашков, тогда все предельно просто, просто кладете рядом с index.html скрипт для просмотра, допустим viewer.php - внутри этого скрипта пишите, чтобы показывал какие файлы есть в текущей директории.

https://www.php.net/manual/ru/function.scandir.php

Ну а дальше из браузера тупо делаете запрос AJAX-ом на этот viewer.php и получаете список файлов.

Answer 2

[zombtron]

Без помощи серверных технологий, чисто на фронте, нельзя.
Если проект ваш, читайте папку на сервере и отдавайте ее клиенту. Если не ваш, и владелец спрятал содержимое, то все... Можно правда косвенно - смотреть откуда что грузится, анализировать имена, проверять, что существует. Но получить все вряд ли получится...

Comments

[Иван Шашков]

читайте папку на сервере и отдавайте ее клиенту

Так, ладно, для тупых, это как произойти должно?

[zombtron]

Если на php, то так:
https://www.php.net/manual/ru/function.scandir.php

[zombtron]

<?php
$dir    = '/tmp';
$files1 = scandir($dir);

echo(json_encode($files1));
?>