Как инициализировать локальную папку на сервере express

Question

Я пытаюсь сделать веб-сайт, в котором должен быть реализован слайдер с динамической подгрузкой в него изображений. Если сокращать код до важных нам размеров, то в <body> у меня есть <div class="ongoings__slider"></div>.

Для него у меня к самой страничке привязан скрипт mainpage.js, внутри которого есть следующее:

function loadSliderImages() {
    var folder = './images/cards';

    $.ajax({
        url : folder,
        success: function (data) {
            $(data).find('a').attr('href', function (i, val) {
                let file = this.href.replace(window.location, '').replace('http//:', '')
                console.log('URL'+file)
                if(val.match(/\.(jpe?g|png|gif)$/)) {
                    $('.ongoings__slider').append('<div class="ongoings__slider__card"> <img class="card_image" src="'
                    + file + '"></img> <div class="card_name"><p>' + createName(getFileName(file)) + '</p></div>');
                } 
            });
        }
    });
}

Запускается сервер с помощью скрипта server.js:

const express = require('express');
const browserSync = require('browser-sync').create();


const app = express();
const port = 5005;


app.use(express.static('data'));


browserSync.init({
    server: {
        baseDir: './data',
    },
    startPath: '/main.html',
    files: ['./**/*.html', './**/*.css', './**/*.js'],
    port: port,
    notify: false,
});

Как видно из кода, скрипт находится в корневой папке проекта, запускает сервер, при загрузке которого загружает страничку main.html. Относительно скрипта сервера папка с нужными изображениями находится по пути data/images/cards. Когда запускал с помощью встроенного live сервера VS Code, всё работало без танцев с бубном.

Пока-что при загрузке страницы, в консоли я вижу следующее: Failed to load resource: the server responded with a status of 404 (Not Found) images/cards/:1 Также, просматривая вкладку "источники", я не вижу нужной мне папки с картинками images/cards.

Нет папки images/cards

Как мне инициализировать эту папку при запуске сервера, чтобы я мог с помощью JS кода выводить картинки на страницу?

UPD:

Всё это по логике мне нужно лишь ради одного: слайдер, который динамически заполняется картинками из определённой папки. Впоследствии я планирую добавить также динамически генерирующиеся блоки (карточки) с фильмами, в которых будет картинка, название и 3 строки из описания. И при клике пользователь будет попадать с главной страницы на страницу самого фильма. Поэтому вопрос очень актуален.

Путём проб и ошибок, я понял, что сервер не хочет работать именно с папками. Если в JS скрипте указать точный путь к одной из картинок, она загрузится. Но когда я пытаюсь "просканировать" папку на файлы в ней, я сталкиваюсь с проблемой, что папка на сервер не была загружена, следовательно, я не могу никаких файлов в ней найти. Как насильно загрузить её на сервер, да и надо ли, может, есть какие-то другие решения данной проблемы?

БЛОГ НА HUSL

Как инициализировать локальную папку на сервере express

Ответы (0 шт):