如何使javascript获取同步?

rqmkfv5c  于 2023-02-02  发布在  Java
关注(0)|答案(5)|浏览(150)

我正在使用fetch从api获取数据json,工作正常,但是我必须在不同的调用中重复使用它,因此它需要同步,否则我需要一些方法来更新接口,当每个组件的fetch完成时。

function fetchOHLC(yUrl){
    fetch(yUrl)
    .then(response => response.json())
    .then(function(response) {
                alert(JSON.stringify(response.query));

            var t = response.created;
            var o = response.open;
            var h = response.high;
            var l = response.low;
            var c = response.close;
        
        return {t,o,h,l,c};
    
    })
    .catch(function(error) {
        console.log(error);
    });    
}

var fetchData = fetchOHLC(yUrl);
alert(fetchData); // empty ?

除了使用fetch,还有其他方法可以实现吗?(我不想使用jquery)。
谢谢

    • 编辑**

这个问题是关于fetch-api的,不是ajax,也不是jquery,所以请不要在没有正确阅读的情况下将其标记为这些问题的重复。

wfveoks0

wfveoks01#

fetch仅用于执行异步调用,但有一些选项:

    • 备选案文1**

如果XMLHttpRequest也可以,那么可以使用async:false,这将执行同步调用。

    • 备选案文2**

使用async/await,它本质上是异步的,但感觉像是同步的,请参见https://stackoverflow.com/a/54950884/2590616

    • 备选案文3**

否则,我需要某种方法在每个组件的获取完成时更新接口
类似于fetch + Promise.all()的声音非常适合,请参见https://stackoverflow.com/a/52013616/2590616

q3aa0525

q3aa05252#

如果不想使用fetch API,则必须使用回调、事件监听器、XMLHttpRequest。

7eumitmz

7eumitmz3#

你总是可以用老式的方式使用xhr。这里是一个请求的例子。

var xhttp = new XMLHttpRequest();
   xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById("demo").innerHTML = this.responseText;
       }
     };

   xhttp.open("POST", "cookies.php", true);
   xhttp.send();
5q4ezhmt

5q4ezhmt4#

您只需要添加回调函数作为参数。

function fetchOHLC(yUrl, callback){
    fetch(yUrl)
    .then(response => response.json())
    .then(function(response) {
            alert(JSON.stringify(response.query));

            var t = response.created;
            var o = response.open;
            var h = response.high;
            var l = response.low;
            var c = response.close;
        
            callback({t,o,h,l,c});
    
    })
    .catch(function(error) {
        console.log(error);
        callback(null, error);
    });    
}

fetchOHLC(yUrl, function(response, error){
    if (response == null) {
        console.log(error);
    } else {
        var fetchData = response;
        alert(fetchData);
    }
});
fjnneemd

fjnneemd5#

  • 如果你来这里是因为你把“如何使javascript获取同步”放到了搜索引擎中:*

这没有多大意义。执行网络操作并不需要CPU工作,因此在fetch(...)期间阻塞它没有什么意义。相反,正确地使用异步工作,如上面链接的duplicate所示。
如果你真的需要一个同步请求(你不需要),使用过时的XMLHttpRequest synchronous变体,引用MDN:
注:从Gecko 30.0(Firefox 30.0 / Thunderbird 30.0 / SeaMonkey 2.27)、Blink 39.0和Edge 13开始,主线程上的同步请求由于对用户体验的负面影响而被弃用。

const request = new XMLHttpRequest();
request.open('GET', '/bar/foo.txt', false);  // `false` makes the request synchronous
request.send(null);

您可以在MDN上找到更多信息。

相关问题