Prevent an ajax 404 error to appear in browser's console

Question

I'm trying to load json files on page load. Those json are located inside a folder and constitute the basis on which the application is then built (each json file represents a page). The problem is that I want the script to be able to handle a random number of json file.

For now, I have the following recursive function which do exactly what I need, it loads each page and when an error occurs, it launches the application initialization. The problem is that my browser displays a 404 error, which is to be expected obviously. I want to know if there is a way to catch the 404 error (which indicates that no more json files are to be loaded) but prevent the error to be displayed in the browser's console?

$(document).ready(function() {
    let pageArray = [];
    loadPages(1, pageArray);

    function loadPages(nb, array) {
        $.ajax({
            url: 'configuration/pages/page' + nb + '.json',
            dataType: 'json',
            error: function() {
                initialize(array);
            },
            success: function(data) {
                array.push(data);
                loadPages(nb + 1, array);
            }
        });
    }

    function initialize(pages) {
        console.log(pages);
    }
});

EDIT

I ended up handling the configuration files with python (django on the server). So python is actually looping through the directory before sending the pages to the client. This doesn't answer the question but rather offers an alternative which is probably the best practice.

Answer 1

In order to prevent error from showing, you'll have to surround the piece of code which encounters the error in try/catch block... Something like this:

function() {
    try {
        openPage();
    } catch (error) {
        // do nothing
    }
}

but I think this is not possible to do in your case, since those types of errors are logged by the browser...

look at: Hide 401 console.error in chrome dev tools getting 401 on fetch() call