javascript - XMLHTTPRequest 错误 : Synchronous XMLHttpRequest on the main thread is deprecated . ..(SoundCloud API)

标签 javascript api xmlhttprequest soundcloud synchronous

我正在使用 XMLHttpRequest 访问 SoundClouds 热门轨道 ( https://api-v2.soundcloud.com/charts?kind=trending&genre=soundcloud:genres:all-music&client_id=1dff55bf515582dc759594dac5ba46e9&q= )。我什至无法进行解析和所有有趣的东西,因为我的控制台记录了此错误:

Synchronous XMLHttpRequest on the main thread is deprecated because of 
its detrimental effects to the end user's experience. For more help 
http://xhr.spec.whatwg.org/

我花了一些时间寻找答案 - 据我所知 - 问题是请求中的一些 JavaScript。因此,我研究了 SoundCloud API,并在每个轨道的属性中发现了这一点:

... "waveform_url":"https://wis.sndcdn.com/2AVcYzUmENai_m.json" ...

所以我发现的类似问题的所有解决方案都不起作用,因为我无法改变他们的 API 的工作方式。也许我做的事情完全错误,你们可以帮忙。

这是导致问题的完整函数(我认为):

function initialSearch() {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', "https://api-v2.soundcloud.com/charts?kind=trending&genre=soundcloud:genres:all-music&client_id=1dff55bf515582dc759594dac5ba46e9&q=", false);
    xhr.addEventListener("load", function() {
        initialArray = JSON.parse(xhr.response);
        }, false);
} 

如果它改变了任何内容,我会在“DOMContentLoaded”上调用它。

也许你可以帮助我。谢谢。

最佳答案

您使用的 XMLHttpRequest 是错误的。进行异步请求而不是同步请求。这是一个固定版本:

function initialSearch() {
    var xhr = new XMLHttpRequest();
    xhr.addEventListener("load", function() {
        initialArray = JSON.parse(xhr.response);
    }, false);
    xhr.open('GET', "https://api-v2.soundcloud.com/charts?kind=trending&genre=soundcloud:genres:all-music&client_id=1dff55bf515582dc759594dac5ba46e9&q=");
    xhr.send();
}

但即便如此,您也会收到请求的资源上不存在“Access-Control-Allow-Origin” header 错误。这是 CORS 浏览器策略错误。您只能向同源资源发出请求。

因此,如果您可以修改服务器代码,请从服务器执行该请求,并更改客户端 AJAX 请求以从服务器请求数据。

关于javascript - XMLHTTPRequest 错误 : Synchronous XMLHttpRequest on the main thread is deprecated . ..(SoundCloud API),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58022785/

相关文章:

php - API 调用限制为 500 个结果 - 如何迭代以获取所有结果?

javascript - XMLHttpRequest 返回未定义的响应,但适用于 console.log

php - 为什么此增值税号验证脚本会返回错误?

javascript - PhpStorm JS 检查 - 来自后端的 JS 变量

javascript - 如何使用 d3 从 JSON 数组元素渲染表格

php - 如何获取基于位置的时间?

c# - 在 C# 中管理 C++ Garmin API

javascript - json_encode php 5.5 vs 5.3 与 js 配合不佳

c# - 如何通过Web API以HttpResponseMessage的形式返回多个json对象?

javascript - 使用 XMLHttpRequest 发送带有数据的文件