Как преобразовать три цепных обратных вызовов (AJAX) в Обещания в Javascript - PullRequest
0 голосов
/ 18 октября 2018

У меня есть этот код:

$.ajax({
    method: 'GET',
    url: 'a.php'
}).done(function(res){
    $.ajax({
        method: 'POST',
        url: 'b.php',
        data: {data: res}
    }).done(function(res){
        console.log(res);
        $.ajax({
            method: 'POST',
            url: 'c.php',
            data: {data: res}
        }).done(function(res){
            console.log(res);
        });
    });
});

Как видите, это всего лишь три функции AJAX.Второй зависит от первого, а третий зависит от второго.

Как я могу преобразовать это в обещания, чтобы избежать использования обратных вызовов и сделать код легче для чтения?

Ответы [ 2 ]

0 голосов
/ 18 октября 2018

Похоже, вы пытаетесь выполнить ~~ синхронные ~~ последовательные сетевые запросы (дождитесь завершения первого, прежде чем выполнять второй), и в этом случае вы можете выполнить одно из следующих действий:

//
// chaining fetches with .then()
//
fetch('a.php')
    .then(res => fetch('b.php', { body: res.json() }))
    .then(res => fetch('c.php', { body: res.json() }))
    .then(res => res.json())
    .then(res => console.log(res)); 

//
// my fav, use async & await
//
(async () => {
    const a = await fetch('a.php'); 
    const b = await fetch('b.php', { body: a.json() });
    const c = await fetch('c.php', { body: b.json() }).then(res => res.json());
    console.log(c); 
})(); 

Редактировать: я предполагал, что из заголовка вашего вопроса вы хотели получить ответы в Javascript (не в jQuery).На самом деле нет причин не использовать fetch, если только вам не требуется поддержка старого браузера, но ... ну ... вот несколько примеров Vanilla JS.

Редактировать 2: Я предполагал, что вам нужен JSON, но вы можетеконвертировать выборочные ответы в текстовые, html, json, возможно, и некоторые другие .. MDN Fetch API

0 голосов
/ 18 октября 2018

С обещаниями jQuery это должно выглядеть следующим образом, с четким разделением проблем между отдельными выборками:

function a() {
    return $.get('a.php');
}

function b(res) {
    return $.post('b.php', {data: res});
}

function c(res) {
    return $.post('c.php', {data: res});
}

function d(res) {
    console.log(res);
}

a().then(b).then(c).then(d);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...