XMLHttpRequest同步或异步

XMLHttpRequest Synchronous or Asynchronous

本文关键字:异步 同步 XMLHttpRequest      更新时间:2023-09-26

在我的JS中,我正在向比特发送一个get请求。ly api来缩短URL。问题是我需要在代码中使用返回的URL。

最好使用同步请求吗?因为它表示在XHR请求之后使用该位的任何代码。ly会失败,因为响应还没有返回短URL。

bitlyXHR.onreadystatechange = function() {
    if (bitlyXHR.readyState == 4) {
        if (bitlyXHR.status == 200) {
            var obj = JSON.parse(bitlyXHR.responseText);
            // Do something
        }
    }
};
bitlyXHR.open("GET", "http://api.bitly.com/v3/shorten?login=&apiKey=&longUrl=" + longURL + "&format=json");
bitlyXHR.send();
// Some code here that uses the short URL

你可以这样做:

function doSomething(obj) {
    // this does something with the result.
}
bitlyXHR.onreadystatechange = function() {
    if (bitlyXHR.readyState == 4) {
        if (bitlyXHR.status == 200) {
           var obj = JSON.parse(bitlyXHR.responseText);
           doSomething(obj); 
        }
    }
};
bitlyXHR.open("GET", "http://api.bitly.com/v3/shorten?login=&apiKey=&longUrl=" + longURL + "&format=json");
bitlyXHR.send();

将使用短URL的代码移动到具有Do something注释的代码部分,或者更好的是,从那里调用包含该代码的函数。

这样做被称为使用回调的。您提供一个稍后在请求返回时执行的函数。这是处理AJAX (A代表异步)请求的最佳方式,因为它不会在等待调用完成时锁定浏览器。