本文翻译自:JavaScript console.log causes error: “Synchronous XMLHttpRequest on the main thread is deprecated…”

I have been adding logs to the console to check the status of different variables without using the Firefox debugger. 我一直在向控制台添加日志,以在不使用Firefox调试器的情况下检查不同变量的状态。

However, in many places in which I add a console.log in my main.js file, I receive the following error instead of my lovely little handwritten messages to myself: 但是,在许多在main.js文件中添加console.logmain.js ,我收到以下错误,而不是给我自己的一些可爱的手写消息:

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. 不赞成在主线程上使用同步XMLHttpRequest,因为它会对最终用户的体验产生不利影响。 For more help http://xhr.spec.whatwg.org/ 有关更多帮助,请访问http://xhr.spec.whatwg.org/

What alternatives to or wrappers for console.log can I add to my code use that will not cause this error? 我可以在使用的代码中添加console.log替代品或包装,而不会导致此错误?

Am I "doing it wrong"? 我“做错了”吗?


#1楼

参考:https://stackoom.com/question/1fNod/JavaScript-console-log导致错误-不赞成在主线程上使用同步XMLHttpRequest


#2楼

The warning message MAY BE due to an XMLHttpRequest request within the main thread with the async flag set to false. 该警告消息可能是由于主线程中的XMLHttpRequest请求将async标志设置为false所致。

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

Synchronous XMLHttpRequest outside of workers is in the process of being removed from the web platform as it has detrimental effects to the end user's experience. 工作者外部的同步XMLHttpRequest正在从Web平台中删除,因为它会对最终用户的体验产生不利影响。 (This is a long process that takes many years.) Developers must not pass false for the async argument when the JavaScript global environment is a document environment. (这是一个耗时多年的漫长过程。)当JavaScript全局环境是文档环境时,开发人员不得为async参数传递false。 User agents are strongly encouraged to warn about such usage in developer tools and may experiment with throwing an InvalidAccessError exception when it occurs. 强烈建议用户代理警告开发人员工具中的此类用法,并可以尝试在发生InvalidAccessError异常时抛出该异常。

The future direction is to only allow XMLHttpRequests in worker threads. 未来的方向是只允许在工作线程中使用XMLHttpRequests。 The message is intended to be a warning to that effect. 该消息旨在作为对此的警告。


#3楼

This happened to me when I was being lazy and included a script tag as part of the content that was being returned. 当我很懒惰时,这发生在我身上,并且在返回的内容中包含了一个脚本标记。 As such: 因此:

Partial HTML Content: 部分HTML内容:

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

It appears, at least in my case, that if you return HTML content like that via xhr, you will cause jQuery to make a call to get that script. 至少在我看来,如果您通过xhr返回类似HTML内容,则将导致jQuery进行调用以获取该脚本。 That call happens with an async flag false since it assumes you need the script to continue loading. 该调用发生在异步标志为false的情况下,因为它假定您需要脚本才能继续加载。

In situations like this one you'd be better served by looking into a binding framework of some kind and just returning a JSON object, or depending on your backend and templating you could change how you load your scripts. 在这种情况下,最好通过研究某种绑定框架并仅返回JSON对象,或者根据后端和模板来改变加载脚本的方式,从而更好地为您服务。

You could also use jQuery's getScript() to grab relevant scripts. 您也可以使用jQuery的getScript()获取相关脚本。 Here is a fiddle, It's just a straight copy of the jQuery example, but I'm not seeing any warnings thrown when scripts are loaded that way. 这是一个小提琴,它只是jQuery示例的直接副本,但是以这种方式加载脚本时,我看不到任何警告。

Example

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

http://jsfiddle.net/49tkL0qd/ http://jsfiddle.net/49tkL0qd/


#4楼

I was also facing same issue but able to fix it by putting async: true. 我也面临着同样的问题,但是能够通过放置async来解决它:true。 I know it is by default true but it works when I write it explicitly 我知道默认情况下它是true,但是当我明确编写它时它可以工作

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

#5楼

I got this exception when I set url in query like "example.com/files/text.txt". 当我在“ example.com/files/text.txt”之类的查询中设置网址时,出现了此异常。 Ive changed url to " http://example.com/files/text.txt " and this exception dissapeared. 我已经将网址更改为“ http://example.com/files/text.txt ”,并且此异常消失了。


#6楼

In my case this was caused by the flexie script which was part of the "CDNJS Selections" app offered by Cloudflare . 在我的情况下,这是由Flexfla脚本引起的,该脚本是Cloudflare提供的“ CDNJS Selections”应用程序的一部分。

According to Cloudflare "This app is being deprecated in March 2015". 根据Cloudflare的说法,“此应用将于2015年3月弃用”。 I turned it off and the message disappeared instantly. 我将其关闭,该消息立即消失。

You can access the apps by visiting https://www.cloudflare.com/a/cloudflare-apps/yourdomain.com 您可以通过访问https://www.cloudflare.com/a/cloudflare-apps/yourdomain.com来访问应用程序

NB: this is a copy of my answer on this thread Synchronous XMLHttpRequest warning and <script> (I visited both when looking for a solution) 注意:这是我对此线程的回答的副本同步XMLHttpRequest警告和<script> (我在寻找解决方案时都访问了)

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

  1. JavaScript console.log %c %o %s %d %f

    Intro 字符串拼接/占位符替换 几乎所有语言都有输出函数,当需要快速拼接多个参数 然后输出的时候,有各自的printf函数和%xxx占位符作为解决方案: C printf("age is ...

  2. javascript通过console.log()控制台输出各种字体样式(3D文字、彩色背景色体)

    一.3D文字 javascript代码如下: <script type="text/javascript"> console.log("%c 神码服云&quo ...

  3. 程序员的浪漫--console.log()在浏览器控制台输出特殊字符编码的图案

    前言:520刚刚过去,不知道大家都做了什么浪漫的事情.下面介绍一种程序员的表白方式 最近在查看某些网站的,发现在浏览器的控制台会打印处理一些特殊的图案,比如知乎.那我们何不把这个换成我们喜欢人的照片. ...

  4. JavaScript异步编程【上】 -- 同步和异步、事件循环(EventLoop)、微任务和宏任务、回调函数

    文章内容输出来源:拉勾教育 大前端高薪训练营 前言 在我们学习JavaScript中,我们知道,JavaScript的执行环境是单线程的.所谓单线程是指一次只能完成一个任务,如果有多个任务,就必须排队 ...

  5. 在主线程执行_深入理解JavaScript执行机制

    1.预备知识 JavaScript是一门单线程语言.单线程就意味着,所有任务需要排队,前一个任务结束,才会执行后一个任务.如果前一个任务耗时很长,后一个任务就不得不一直等着. 所有任务可以分为两种,一 ...

  6. 错误传播 --try{}catch(e){console.log(e)}

    1.如果代码发生了错误,又没有被try ... catch捕获,那么,程序执行流程会跳转到哪呢? function getLength(s) {return s.length; }function p ...

  7. javascript教程:console.log 详解

    对应WEB程序员,console.log 可以说是神器,极大地方便了程序开发.程序猿:学习了,用Console写日志比alert方便多了. console.log(object[, object, . ...

  8. Javascript调试命令——你只会Console.log() ?

    Javascript调试命令--你只会Console.log() ? Console 对象提供对浏览器控制台的接入(如:Firefox 的 Web Console).不同浏览器上它的工作方式是不一样的 ...

  9. 理解javascript中的在控制台输出方式console.log

    大家都有用过各种类型的浏览器,每种浏览器都有自己的特色,本人拙见,在我用过的浏览器当中,我是最喜欢Chrome的,因为它对于调试脚本及前端设计调试都有它比其它浏览器有过之而无不及的地方.可能大家对co ...

最新文章

  1. Word文档以两列的格式打开,类似于书本那样
  2. JPTagView-多样化的标签View
  3. 【番外篇1】青龙面板中cron表达式新手入门教程cron的介绍与使用
  4. Java 中的二维数组
  5. 上传问题总结(文件大小检测,大文件上传)
  6. 手机室内地磁定位软件_聊一聊神奇的室内地磁定位
  7. linux将日期和日历信息追加到文件中_Linux常用指令
  8. 使用物理硬盘_硬盘坏道的几种非专业修复方法介绍
  9. C语言,利用一维数组交换法排序,使学生成绩高低排序(要求输入为负值时输入结束)
  10. java中的无效的列类型_java.sql.SQLException: 无效的列类型: 1111
  11. aix 文件升级-替换
  12. srs流媒体服务器+obs推流(简单)
  13. python-faker库使用
  14. 小猿圈解读Go语言的前景
  15. Maze CodeForces - 377A
  16. 2021年连云港高考成绩查询,2021年连云港高考状元是谁分数多少分,历年连云港高考状元名单...
  17. 转铁蛋白(Tf)修饰去氢骆驼蓬碱磁纳米脂质体/香豆素-6脂质体/多柔比星脂质体
  18. 为什么我说低代码是“行业毒瘤”?
  19. HDU6598 Harmonious Army
  20. 秒(s) 毫秒(ms) 微秒(μs) 纳秒(ns) 皮秒(ps)及Java获得

热门文章

  1. 《Effective C#》快速笔记(三)- 使用 C# 表达设计
  2. Hive Udf Rank
  3. mvc VIEW部分介绍
  4. 转:在ubuntu下将dmg文件转化为iso格式
  5. CListCtrl使用指南
  6. 用Python读取CSV文件的5种方式
  7. Win7 连接局域网共享之后 提示错误代码:0x800704b3(实测可用)
  8. 使用Zabbix进行IPMI监控
  9. Excel中数据透视表的 使用 创建(ピポットテーブル)
  10. 力扣题目——700. 二叉搜索树中的搜索