вызов ajax внутри xhr внутри цикла for

Я пытаюсь вызвать ajax внутри запроса XHR цикла, но результаты ajax дают мне только последний..или только один раз..

$("#txtArea").contents().find('img').each(function () {
            ctr++;
            xhr= new XMLHttpRequest();
            xhr.open('GET', $(this).attr("src"), true);

            xhr.responseType = 'blob';

            xhr.onload = function (e) {
                if (this.status == 200) {
                    var blob = this.response;
                    var reader = new window.FileReader();
                    reader.readAsDataURL(blob); 
                    reader.onloadend = function() {
                        base64data = reader.result;


                        console.log("cheweee");

                    base64ToImage(base64data, ctr);  <<--this is the ajax call

                    }


                }

            };

вот ajax

function base64ToImage(base64data,ctr) {

    $.ajax({
        method: "POST",
        url: "ConvertB64",
        async: false,
        data: {
            base64datastring: base64data, imgctr: ctr
        },
        success: function (data) {
            console.log(data);
        }
    })

        .done(function (msg) {
            console.log(msg);
        });
}

вот что я пытаюсь сделать..Я преобразую url-адрес объекта в большой двоичный объект, затем передаю этот большой двоичный объект для преобразования в изображение, а затем возвращаю расположение изображения для моего тега img.

на стороне xhr я могу получить данные blob хорошо, но преобразование в изображение происходит только один раз. и это последняя капля.

im с помощью mvc. и я попытался создать упорядоченный xhr, как этот XHR[ctr], и я также добавил asynch: false.

спасибо

2 ответа

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

    $("#txtArea").contents().find('img').each(function (i) {
        ...
        ...
        base64ToImage(base64data, i+1); //index starts with 0 so adding 1
    });
    
  2. Попробуйте сделать первый запрос ajax синхронным и проверьте…..поскольку вы отправляете несколько ajax-запросов одновременно, ответ не упорядочен, и это может быть проблемой