JavaScript console.log导致错误：“不赞成在主线程上使用同步XMLHttpRequest…”

我一直在向控制台添加日志，以在不使用Firefox调试器的情况下检查不同变量的状态。

但是，在许多我console.log在main.js文件中添加的地方，我收到以下错误，而不是给我自己一些可爱的手写消息：

不赞成在主线程上使用同步XMLHttpRequest，因为它会对最终用户的体验产生不利影响。有关更多帮助，请访问http://xhr.spec.whatwg.org/

console.log我可以在代码使用中添加哪些替代品或包装，而不会导致此错误？

我“做错了”吗？

当我很懒惰时，这发生在我身上，并且在返回的内容中包含了一个脚本标记。因此：

部分HTML内容：

<div> 
 SOME CONTENT HERE
</div>
<script src="/scripts/script.js"></script> 

至少在我看来，如果您通过xhr返回类似HTML内容，则将导致jQuery进行调用以获取该脚本。该调用使用异步标志false发生，因为它假定您需要脚本才能继续加载。

在这种情况下，最好通过研究某种绑定框架并仅返回JSON对象，或者根据后端和模板来改变脚本的加载方式，从而更好地为您服务。

您也可以使用jQuerygetScript()来获取相关脚本。这是一个小提琴，它只是jQuery示例的直接副本，但是以这种方式加载脚本时，我看不到任何警告。

例

<script>
var url = "/scripts/script.js";
$.getScript(url);
</script>

http://jsfiddle.net/49tkL0qd/

警告消息可能是由于主线程中的XMLHttpRequest请求将async标志设置为false。

https://xhr.spec.whatwg.org/#synchronous-flag：

工作者外部的同步XMLHttpRequest正在从Web平台中删除，因为它会对最终用户的体验产生不利影响。（这是一个耗时多年的漫长过程。）当JavaScript全局环境是文档环境时，开发人员不得为async参数传递false。强烈建议用户代理警告开发人员工具中的此类用法，并可以尝试在发生InvalidAccessError异常时抛出该异常。

未来的方向是只允许在工作线程中使用XMLHttpRequests。该消息旨在作为对此的警告。

我也面临着同样的问题，但是能够通过放置async来解决它：true。我知道默认情况下它是true，但是当我明确编写它时它可以工作

$.ajax({
   async: true,   // this will solve the problem
   type: "POST",
   url: "/Page/Method",
   contentType: "application/json",
   data: JSON.stringify({ ParameterName: paramValue }),
});

Visual Studio 2015/2017的实时调试器正在注入包含不赞成使用的调用的代码。

有时有必要ajax加载脚本，但是将文档准备工作推迟到加载脚本之后。

jQuery通过此holdReady()功能支持此功能。

用法示例：

$.holdReady(true);                              //set hold
function releaseHold() { $.holdReady(false); }  //callback to release hold
$.getScript('script.js', releaseHold);          //load script then release hold

实际的脚本加载是异步的（无错误），但是如果您的其余JavaScript在文档准备就绪后运行，则效果是同步的。

动态脚本加载程序通常会使用此高级功能，即使DOM可能已就绪，这些脚本仍希望在允许ready事件发生之前先加载jQuery插件等其他JavaScript。

文档：https：
//api.jquery.com/jquery.holdready

更新2019年1月7日

从JQMIGRATE：

jQuery.holdReady（）已弃用

原因：该jQuery.holdReady()方法由于对页面的整体性能有不利影响而已被弃用。此方法可以防止页面上的所有代码初始化较长的时间。

解决方案：重写页面，以便不需要延迟所有jQuery ready处理程序。例如，可以通过仅在安全运行时延迟加载仅需要延迟的代码来实现此目的。由于此方法的复杂性，jQuery Migrate不会尝试填充功能。如果与jQuery Migrate一起使用的jQuery的基础版本不再包含jQuery.holdReady()该代码，则此警告出现后不久将失败。

为避免此警告，请勿使用：

async: false

在您的任何$ .ajax（）调用中。这是不推荐使用的XMLHttpRequest的唯一功能。

默认是

async: true

jQuery已弃用同步XMLHTTPRequest

@Webgr部分答案实际上帮助我调试了此警告@控制台日志，可耻的是该答案的另一部分带来了太多的反对意见:(

无论如何，这是我如何发现此警告的原因：

1. 使用Chrome浏览器>点击F12带来DevTools
2. 打开抽屉菜单（在右上角的Chrome 3垂直点中）
3. 在控制台下 >检查Log XMLHttpRequests选项
4. 重新加载出现错误的页面，并观察控制台日志中每个ajax请求的结果。

就我而言，另一个插件在每次ajax调用后加载2个.js库，这绝对不是必需的。禁用恶意插件会从日志中删除警告。从那时起，您可以尝试自己解决问题（例如，将脚本的加载限制在某些页面或事件上-这对于此处的答案而言太具体了）或联系第三方插件开发人员来解决。

希望这对某人有帮助。

我一直在寻找所有令人印象深刻的答案。我认为他应该提供给他一个问题的代码。给出下面的示例，如果您有一个脚本链接到page.php中的jquery，则您会得到通知。

$().ready(function () {
    $.ajax({url: "page.php",
        type: 'GET',
        success: function (result) {
        $("#page").html(result);
   }});
 });

在以下情况下，我会收到这样的警告：

1）包含的file1 <script type="text/javascript" src="/javascript/jquery-1.10.2.js"></script>。页面具有输入字段。我在输入字段中输入一些值，然后单击按钮。jQuery将输入发送到外部php文件。

2）外部php文件还包含jquery，在外部php文件中我也包含<script type="text/javascript" src="/javascript/jquery-1.10.2.js"></script>。因为如果这我得到警告。

<script type="text/javascript" src="/javascript/jquery-1.10.2.js"></script>从外部php文件中删除，并且在没有警告的情况下工作。

据我了解，加载第一个文件（file1）时，我加载jquery-1.10.2.js并且页面未重新加载（它使用jquery将数据发送到外部php文件$.post），然后jquery-1.10.2.js继续存在。因此，无需再次加载它。

当我在“ example.com/files/text.txt”之类的查询中设置网址时，出现了此异常。我已经将网址更改为“ http://example.com/files/text.txt ”，并且此异常消失了。

我因为在一个can.js脚本中包含另一个脚本而感到异常，例如，

{{>anotherScript}}

在MVC应用程序中，收到此警告，是因为我正在使用返回View（）而不是PartialView（）的方法打开Kendo窗口。View（）试图再次检索该页面的所有脚本。

ZF2中发生了这件事。我试图加载Modal内容，但之前忘记禁用布局。

所以：

$viewModel = new ViewModel();
$viewModel->setTerminal(true);
return $viewModel;

像@Nycen一样，由于指向Cloudfare的链接，我也遇到了此错误。我的是Select2插件。

修复它我刚刚删除

 src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"

错误消失了。

1. 在Chrome中， press F12
2. 展开工具->按F1。
3. 请参阅设置"Don't show chrome Data Saver warning"- >常规- >外观：-设置此复选框。
4. 参见设置->常规->控制台："Log XMLHTTPRequest"-也设置此复选框。

请享用

就我而言，这已解决。

JS

$.ajaxPrefilter(function( options, original_Options, jqXHR ) {
    options.async = true;
});

此答案已插入此链接

/programming/28322636/synchronous-xmlhttprequest-warning-and-script

就我而言，这是由Flexfla脚本引起的，该脚本是Cloudflare提供的“ CDNJS Selections”应用程序的一部分。

根据Cloudflare的说法，“此应用将于2015年3月弃用”。我将其关闭，该消息立即消失。

您可以通过访问https://www.cloudflare.com/a/cloudflare-apps/yourdomain.com来访问应用程序

注意：这是我在该线程上的答案的副本Synchronous XMLHttpRequest警告和<script>（我在寻找解决方案时都去过了）

我通过以下步骤解决了这个问题：

1. 检查您的CDN脚本并将其添加到本地。
2. 将您的脚本包括在标题部分。

在我的特定情况下，我正在渲染Rails局部，没有render layout: false它，则重新呈现了整个布局，包括<head>标记中的所有脚本。向render layout: false控制器添加动作可解决此问题。

对我来说，问题在于，在OK请求中，我希望ajax响应是格式正确的HTML字符串（例如表格），但是在这种情况下，服务器遇到请求问题，并重定向到错误页面，因此，它返回了错误页面的HTML代码（该<script代码在某处有一个标签。我在控制台上记录了ajax响应，那时我意识到这不是我所期望的，然后继续进行调试。

这个问题在2014年和2019年提出，所以我认为寻找更好的选择是一个好办法。

您只需fetch在Javascript中使用api，即可为您提供更大的灵活性。

例如，请参见此代码

fetch('./api/some.json')
    .then((response) => {
        response.json().then((data) => { 
            ... 
        });
    })
    .catch((err) => { ... });