在异步函数中接收有关同步 XMLHttpRequest 的警告

Question

我的浏览器（或 JQuery 框架，更具体地说）将以下警告打印到浏览器的控制台：

主线程上的同步 XMLHttpRequest 已被弃用，因为它会对最终用户的体验产生不利影响。 如需更多帮助，请查看http://xhr.spec.whatwg.org/ 。

我理解警告，但不明白它为什么出现。 据我了解， asyncFunct() 的调用是异步的，因此不应打印警告消息。

我正在使用这个 JavaScript 代码：

 var i18nObject; $(document).ready(function () { // execute asyncFunct() asynchronously setTimeout(asyncFunct, 3000); }); function asyncFunct() { alert(i18n("rejoin.title")); } function i18n(key) { if (typeof i18nObject == 'undefined') { // i18n not loaded yet, need to load it first $.ajax({ url: 'UrlTo/i18n.json', async: false, dataType: 'json', success: function (response) { i18nObject = response; } }); } if (i18nObject.hasOwnProperty(key)) { // key found return i18nObject[key]; } else { // key not found return key; } }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

面对一些关于async: false担忧（来自评论）：这是故意选择的，因为我需要函数返回一个值。 我知道如果他们锁定 UI，使用同步调用是一个坏主意。 但是为什么这适用于我的问题？ 我希望对 asyncFunct() 的调用是异步的。

为什么我会收到此警告，是否可以禁用它？ （防止控制台中出现不必要的文本）

Answer 1

编辑

实际上，由于您将同步调用置于超时内，因此正如您正确指出的那样，该调用似乎是异步发生的（请参阅此 jsbin示例）：

setTimeout(function() {
  $.ajax({
    method: 'GET',
    url: 'http://api.openweathermap.org/data/2.5/weather?q=London,uk',
    success: function(res) {
      console.log(res);
    },
    async: false
  });
}, 1000);

console.log('something synchronous');

如果您打开控制台，您会注意到（正如预期的那样），首先记录了something synchronous内容，然后在一秒多之后，记录了我们 API 的结果。

所以我觉得这个问题有两个部分需要解决。

第一部分是，当您可以完全避免超时并简单地使您的 XMLHttpRequest 自然异步时，为什么要使用已弃用的 API 强制同步调用发生异步？

第二部分是关于抑制警告。 似乎警告发生错误，但警告并未考虑您在超时内发出同步请求的事实。 它只是查看您正在使用已弃用的 API 的事实。 也就是说，警告只关心被弃用的API本身的使用情况，而不关心具体的实现。

但是，如果您真的想抑制这些警告，那将是一个全有或全无的交易（请参阅此答案以获取示例）：

// define this as an empty function in your own code
console.log = function() {};

原答案

据我了解， asyncFunct() 的调用是异步的，因此不应打印警告消息。

错误的。

您的调用不是异步的。 它是同步的，因为你有async: false 。

这个警告是因为同步请求阻塞了主线程（例如，处理 UI 的同一个线程）。 这可能会破坏用户使用网站/应用程序的体验。 因此，警告显示在控制台中。