I have a JS library that is responsible to perform the download of JPEG images for the client. All of this is done asynchronously. In some cases, the count of images is really large... Around 5000 images. In this case, the Chrome browser issues the "ERR_INSUFFICIENT_RESOURCES" error for the ajax request.

Each request must be done individually, there is no option to pack the images on the server-side.

What are my options here? How can I find a workaround for this problem? The download works fine in Firefox...

Attached code of the actual download:

function loadFileAndDecrypt(fileId, key, type, length, callback, obj) {     

 var step = 100 / length;

 eventBus.$emit('updateProgressText', "downloadingFiles");


  var req = new dh.crypto.HttpRequest();
    req.setAesKey(key);
    let dataUrl;
    
    if (type == "study")  {
         dataUrl = "/v1/images/";
    }else {
         dataUrl = "/v1/dicoms/";
    }    

    var url = axios.defaults.baseURL + dataUrl + fileId;
    req.open("GET", url, true);
    req.setRequestHeader("Authorization", authHeader().Authorization+"")
    req.setRequestHeader("Accept", "application/octet-stream, application/json, text/plain, */*");
    req.responseType = "arraybuffer";

    req.onload = function() {
        console.log(downloadStep);    
        downloadStep +=  step;
        eventBus.$emit('updatePb', Math.ceil(downloadStep));

        var data = req.response;
        obj.push(data);
        counter ++;        
        //last one
        if (counter == length) {        
            callback(obj);        
        }
    };

    req.send();
}