Chr*_*ken 15 javascript ajax google-chrome popup synchronous
我们有一种情况,我们需要在执行XHR/Ajax请求后在浏览器中打开一个新选项卡.
我们通过将Ajax请求设置为同步执行以保持受信任的click事件的上下文来实现此目的,这样可以正常工作.
但是,在最新的Chrome版本(36)中,当Ajax调用有一些延迟时,我们会遇到弹出警告... 2秒的延迟足以让Chrome显示弹出警告,而不是像预期的那样打开标签.代码本身正常工作,我可以多次单击该按钮,它一直有效,直到请求遇到一些延迟.然后我得到弹出警告......
是否存在应用于同步Ajax请求的超时,在此期间需要完成它以使可信事件仍然可用?
有没有办法规避这个?毕竟,呼叫已经同步并冻结其他所有内容,直到结果到来.
谢谢.
更新:我已经创建了一个JSFiddle来演示这个问题:http://jsfiddle.net/23JNw/9/
/**
* This method will give open the popup without a warning.
*/
function performSlowSyncronousRequest() {
$.ajax({
url: '/echo/html',
data: {delay: 2}, //JSfiddle will delay the answer by 2 seconds
success: function(){
window.open('http://www.thirtykingdoms.com'); //this causes the popup warning in Chrome
},
async: false
});
}
Run Code Online (Sandbox Code Playgroud)
可能解决此问题的方法是在XHR请求返回之前以及您仍在可信上下文中时打开新选项卡.通过Javascript打开的浏览器选项卡和窗口保持与父窗口的连接,并且可以来回通信.
如果在单击链接时打开新选项卡,则可以在XHR调用运行时在新窗口中显示加载屏幕.这个工作流程不像原始请求那么干净,但是如果有一些想法,这将是一个可行的解决方案.下面的脚本只是一个使用window.setTimeout()来模拟异步XHR请求的快速示例.
<html>
<body>
<h4>
Hello
</h4>
<a id="openWindow" href="">Make http call and open window.</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>
(function ($) {
var newWindow = null,
timeout = null;
$(document).ready(function () {
$('#openWindow').on('click', function (evt) {
evt.preventDefault();
newWindow = window.open('about:blank', 'tempWindow');
$(newWindow.document).find('body').append('<div class="loading">Loading...</div>');
timeout = window.setTimeout(function () {
// simulates async XHR
$(newWindow.document).find('.loading').remove();
$(newWindow.document).find('body').append('Done loading, here\'s your data');
}, 5000)
});
});
}(jQuery));
</script>
</body>
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
7327 次 |
最近记录: |