Ajax call throws 404 when loading images from folder

Question

I am trying to load images from folder via jquery and ajax and I'm using the solution provided here. However, this throws a 404 error - even though the directory definitely exists, and I even can access the files in it.

Here's the jquery code:

$(document).ready(function () {
var folder = "images/";

$.ajax({
    url: folder,
    success: function (data) {
        $(data).find("a").attr("href", function (i, val) {
            if (val.match(/\.(jpe?g|png|gif)$/)) {
                $('#galerie').append('<a class="image_anchor" data-fancybox="gallery" href="resources/img/header_bg.jpg"><img src="' + folder + val + '" /></a>')
            }
        });
    }
});
});

score 1 · Accepted Answer · answered Mar 18 '18 at 12:14

As it is mentioned in the question you looked at

//This will retrieve the contents of the folder if the folder is configured as 'browsable'

Put a .htaccess file in the directory where your images are located. The content of the .htaccess file should look like:

Options +Indexes

More info: https://support.tigertech.net/directory-index

Please keep in mind you need to run the page on a webserver since you are using .htaccess (no PHP needed)

score 1 · Answer 2 · answered Mar 18 '18 at 12:42

1

It was caused by

not having .htaccess in the directory
using the WebStorm instead of xampp (I do not know why, but it just does not work on WebStorm server)

answered Mar 18 '18 at 12:42

anon

357
5
20

Ajax call throws 404 when loading images from folder

2 Answers2