Javascript 函数按顺序运行

Question

这个问题已经有答案了:

How do I return the response from an asynchronous call? (42 个回答)

How do I promisify native XHR? (6 个回答)

已关闭 4 年前。

我在订购函数时遇到一些问题。

我有2个功能。其中两个是http请求。

什么场景？

在第一个请求中，我得到了一些响应，在这个响应中，我得到了一些字符串并将其设置为某个变量。

在第二个请求中，我将此字符串添加到我的请求网址中。

但是当我设置变量时，我的第二个请求在第一个请求响应之前工作。

因此，我的变量值未定义。

我知道这是同步、异步问题，但我如何解决这个问题？

这是我的变量，我将在第二个请求 URL 的末尾添加它。

var urlString = '';

这是我的第一个请求:

var requestone = new XMLHttpRequest();
requestone.onload = function () {
    if (requestone.status >= 200 && requestone.status < 300) {
        var data = requestone.response;
        data = JSON.parse(data);
        urlString = data.Key
    } else {
        console.log('fail')
    }
};

requestone.open('GET', 'apiurl');
requestone.send();

这是我的第二个请求:

var requesttwo = new XMLHttpRequest();
    requesttwo.onload = function () {
        if (requesttwo.status >= 200 && requesttwo.status < 300) {
            var data = requesttwo.response;

        } else {
            console.log('fail')
        }
    };

    requesttwo.open('GET', 'apiurl' + urlString);
    requesttwo.send();

Answer 1

您可以通过两种方式执行此操作，使用 Promise，或将第二个请求集成到 request1 中:

var requestone = new XMLHttpRequest();
requestone.onload = function () {
    if (requestone.status >= 200 && requestone.status < 300) {
        var data = requestone.response;
        data = JSON.parse(data);
        requesttwo.open('GET', 'apiurl' + data.Key);
        requesttwo.send();
    } else {
        console.log('fail')
    }
};

requestone.open('GET', 'apiurl');
requestone.send();