我收到一条警告信息:
主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用.如需更多帮助,请访问http://xhr.spec.whatwg.org/.
当执行包含脚本(具有本地src)的异步AJAX请求时,使用$.html()方法将其注入HTML .我已经将给定的脚本更改为包含async="async",但警告消息仍然存在.
我已经开始调试这个问题,发现我的附加<script>是通过来自jQuery.ajaxTransport(http://code.jquery.com/jquery-1.10.0.js,#8663)的jquery AJAX调用来处理的,其中async设置为false(这可能是问题来自).
现在 - 我该怎么办呢？
该消息显示在最新版本的Chrome和Firefox中.
虽然我无法在jsfiddle上提供测试用例,但这是一个显示问题的测试用例:
的test.html
<html>
<body>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script>
$(document).ready(function(){
$.ajax({
url: '/response.html',
success: function(response){
$(document.body).html(response);
}
})
});
</script>
</body>
</html>
response.html
<script type="text/javascript" src="/json.js" async="async"></script>
json.js
console.log('hi');
触发警告不需要AJAX请求 - 只需要插入一个 <script>
test2.html
<html>
<body>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script>
$(document).ready(function(){
$(document.body).html('<script type="text/javascript" src="/json.js" async="async"><\/script>');
});
</script>
</body>
</html>
值得注意的是,这已经修复,按照https://github.com/jquery/jquery/issues/2060
A. *_*lff 56
更新:
这已在jQuery 3.x中修复.如果您无法升级到3.0以上的任何版本,则可以使用以下代码段但请注意,现在您将失去目标内容中脚本加载的同步行为.
您可以修复它,将xhr请求的显式异步选项设置为true:
$.ajaxPrefilter(function( options, original_Options, jqXHR ) {
options.async = true;
});
小智 12
浏览器现在警告使用同步XHR.MDN说这是最近实施的:
从Gecko 30.0开始(Firefox 30.0/Thunderbird 30.0/SeaMonkey 2.27)
以下是在Firefox和Chromium中实现更改的方法:
至于Chrome人员报告这种情况开始发生在版本39左右.我不确定如何将修订版/变更集链接到特定版本的Chrome.
是的,它发生在jQuery将标记附加到页面时,包括加载外部js文件的脚本标记.你可以用这样的东西重现它:
$('body').append('<script src="foo.js"></script>');
我想jQuery将在未来的某个版本中解决这个问题.在此之前,我们可以忽略它或使用A. Wolff的建议.
尽管使用async，但我还是被此错误消息困扰：true。原来实际的问题是使用该success方法。我将其更改为done，警告已消失。
success: function(response) { ... }
替换为：
done: function(response) { ... }
小智 5
如果您只需要加载脚本，请不要执行以下操作
$(document.body).html('<script type="text/javascript" src="/json.js" async="async"><\/script>');
尝试这个
var scriptEl = document.createElement('SCRIPT');
scriptEl.src = "/module/script/form?_t="+(new Date()).getTime();
//$('#holder').append(scriptEl) // <--- create warning
document.body.appendChild(scriptEl);
| 归档时间： |
|
| 查看次数： |
141087 次 |
| 最近记录： |