Сохранить ajax вернуть данные в массив и вызвать этот массив за пределами ajax - PullRequest
1 голос
/ 05 марта 2020

Я создал аудиоплеер. Он начинается с пользовательского массива, но размер моих аудиофайлов составил 1,6 ГБ. Он уничтожит данные моего веб-сайта, поэтому я сейчас использую ajax данные Quran. Я создал ajax вызов для получения Quran surahs и внутри ajax success function Я выполняю for loop для получения all surahs, теперь я хочу сохранить данные list of Surahs в массив, чтобы я мог использовать за пределами ajax в моем аудиоплеере.

Вот мой код:

$(function(){

    // Surahs array and variables

    $.ajax({
        url: 'http://mp3quran.net/api/_english.php',
        type: 'get',
        success: function(data){

            let urlServer = data.reciters[112].Server;

            let resUrl;
            for(resUrl=1; resUrl <= 114; resUrl++){

                resUrl = resUrl < 10 ? '00' + resUrl : '' + resUrl;
                resUrl = (resUrl < 100 && resUrl > 9) ? '0' + resUrl : '' + resUrl;

                let surahs = urlServer + '/' + resUrl + '.mp3' ;
                console.log(surahs);

            }

        },
        error: function(err){
            console.log(err);
        }
    });

   // custom array, I wanna save here my ajax succes data like array
   // so i can use that in my custom audio player.
    let surahs = [
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3',
                    'url.mp3'
                ];

    let surahTitle = $('.surahTitle');
    let surah = new Audio();
    let currentSurah = 0;
    let surahsLength = surahs.length;

    // Every Surah source
    function nextSurahSrc(currentSurah){
        let surahTitleString = surahs[currentSurah].replace(/[_]/g, " ");
        surahTitleString = surahTitleString.replace('.mp3', "");
        surahTitleString = surahTitleString.trim();

        surah.src = webUrl + 'surahs/' + surahs[currentSurah];
        surahTitle.text(surahTitleString);
    }
    nextSurahSrc(currentSurah);

    // Play Surah
    function playSurah(){
        surah.play();
    }

    // Pause Surah
    function pauseSurah(){
        surah.pause();
    }

});

Этот ajax URL возвращает URL, и если вы откроете этот URL, вы будет направлен в каталог аудио mp3, я делаю этот аудио mp3 в моем для l oop, который находится в ajax вызове.

В настоящее время я получаю ajax URL данных, как это:

enter image description here

Но я хочу сохранить его в массив. Теперь, пожалуйста, помогите мне сохранить ajax данные в массив, чтобы я мог использовать этот массив в моем собственном аудиоплеере. Пожалуйста, помогите мне, я застрял.

Вот то, что я пытался с CTL's answer:

$(function(){

    let surahArray = [];
    // Surahs array and variables

    $.ajax({
        url: 'http://mp3quran.net/api/_english.php',
        type: 'get',
        success: function(data){

            let urlServer = data.reciters[112].Server;

            let resUrl;
            for(resUrl=1; resUrl <= 114; resUrl++){
                resUrl = resUrl < 10 ? '00' + resUrl : '' + resUrl;
                resUrl = (resUrl < 100 && resUrl > 9) ? '0' + resUrl : '' + resUrl;

                surahArray.push(urlServer + '/' + resUrl + '.mp3');

            }

        },
        error: function(err){
            console.log(err);

        }
    });

    let surahs = surahArray;
    // working
    console.log(surahs);

    // not working any of them
    console.log(surahs[0]);
    console.log(surahs.0);

)}

Я получаю массив за пределами ajax, но невозможно получить значения массива, проверьте
Вот скриншот консоли:
enter image description here

1 Ответ

1 голос
/ 05 марта 2020

Создайте пустой массив в самом верху вашей функции и введите sh новые URL по мере их поступления. Затем используйте массив позже. ie:

let surahArr = []

//..inside ajax success
surahArr.push(urlServer + '/' + resUrl + '.mp3');

//then later in your app, you can loop over them
for(let surah of surahArr){
        //do stuff with surah
}
...