Не удалось выполнить ‘json’ в ‘Ответе’: основной поток уже прочитан при использовании setInterval

#javascript #jquery #ajax #api #fetch-api

#javascript #jquery #ajax #API #fetch-api

Вопрос:

Я пытаюсь обновить данные (out.rule ), которые возвращаются сервером каждые 2000 мс, чтобы делать свои дела (я не пишу серверную часть), но получаю сообщение об ошибке: не удалось выполнить ‘json’ в ‘Ответе’: основной поток уже прочитан.

Мой запрос post :

 var fetchURL = fetch("myURL", {
    "headers": {
        "accept": "application/json, text/plain, */*",
        "accept-language": "vi-VN,vi;q=0.9,fr-FR;q=0.8,fr;q=0.7,en-US;q=0.6,en;q=0.5",
        "content-type": "application/json;charset=UTF-8",
        "sec-fetch-dest": "empty",
        "sec-fetch-mode": "cors",
        "sec-fetch-site": "cross-site"
    },

    "referrerPolicy": "strict-origin-when-cross-origin",
    "body": "{myBody}",
    "method": "POST",
    "mode": "cors",
    "credentials": "omit"
});



var refreshIntervalId = setInterval(function() {

    fetchURL.then(res => res.json()).
    then((out) => {
        if (out.rule == admin) {  do something  }
    }).
    catch(err => {
        throw err
    });
    console.log('Error')
}, 2000);
 

Ответ №1:

Вы уже выполняете выборку в первой строке. В течение интервала вы только .then() повторяете одно и то же обещание, поэтому вы получаете указанную ошибку.

Вы можете исправить это, создав функцию, которая вызывает выборку, а затем вызывает ее на каждой итерации.

Обратите внимание, что интервал может выполнять несколько внутренних запросов до возврата первого запроса, скажем, если серверная часть по какой-то причине отвечает медленно. Возможно, вы захотите убедиться, что предыдущий запрос завершен, прежде чем выполнять следующий.

 var fetchURL = () => fetch("myURL", {
    "headers": {
        "accept": "application/json, text/plain, */*",
        "accept-language": "vi-VN,vi;q=0.9,fr-FR;q=0.8,fr;q=0.7,en-US;q=0.6,en;q=0.5",
        "content-type": "application/json;charset=UTF-8",
        "sec-fetch-dest": "empty",
        "sec-fetch-mode": "cors",
        "sec-fetch-site": "cross-site"
    },

    "referrerPolicy": "strict-origin-when-cross-origin",
    "body": "{myBody}",
    "method": "POST",
    "mode": "cors",
    "credentials": "omit"
});

var refreshIntervalId = setInterval(function() {

    fetchURL().then(res => res.json()).
    then((out) => {
        if (out.rule == admin) {  do something  }
    }).
    catch(err => {
        throw err
    });
    console.log('Error')
}, 2000);