即使打开另一个浏览器,Iframe也会窃取焦点

Iframe steals focus even another browser is opened

本文关键字:焦点 Iframe 另一个 浏览器      更新时间:2023-09-26

我们有一个网站,我们使用iframe加载一些数据(iframe长轮询)。这些数据可以自动加载,例如每2分钟加载一次。当这个网站在IE中打开时(在最新版本中试用),它将每2分钟发送一次请求。没关系。

但是当我们打开另一个浏览器(或程序)并且IE不在焦点中时-在每个请求期间IE将为自己抓取焦点…

也许有人知道如何解决这个问题(防止IE窃取焦点)?据我所知,Ajax请求可以解决这个问题,但这可能很难更新…

更新:

从服务器(在Iframe中)返回如下内容:

<html><body>
<script>parent.MailChecker.updateStatus({"s":"Connecting to xxx@gmail.com...","p":0,"c":null,"e":false})</script>
<script>parent.MailChecker.updateStatus({"s":"Preparing to fetch emails...","p":0,"c":null,"e":false})</script>
<script>parent.MailChecker.updateStatus({"s":"Downloading 1 email from 35...","p":2.8571428571429,"c":null,"e":"784"})</script>
<script>parent.MailChecker.updateStatus({"s":"Downloading 2 emails from 35...","p":5.7142857142857,"c":null,"e":"784"})</script>
...
<script>parent.MailChecker.updateStatus({"s":"Done!","p":100,"c":"0","e":false})</script>
</body></html>

从IFRAME技术更改为使用XMLHttpRequest解决方案(由数千个站点/web应用程序使用)将消除您的焦点问题。许多Comet服务器都使用这种技术,其中一些在这里列出。

正如评论中所讨论的,您应该使用XHR请求(长轮询或流),这样您就可以将更新从服务器推送到只包含数据的客户机。可以使用XMLHttpRequest (XHR)对象使用HTTP长轮询或HTTP流。从上面可以看到数据如下所示:

{"s":"连接到xxx@gmail.com…","p":0,"c":空,"e":假}

然后,当状态改变时,沿着连接推送另一个更新,例如

{"s":"准备取回邮件…","p":0,"c":空,"e":假}

XHR的处理程序然后可以检查XHR.responseText并解析更新值。如果您使用的是长轮询,那么就像这样简单:

var update = JSON.parse(xhr.responseText);
MailChecker.updateStatus(update);

如果您正在使用XHR流,那么您还需要解析来自XHR的先前更新。responseText,因为它的大小一直在增长。更多关于HTTP流的信息:http://ajaxpatterns.org/HTTP_Streaming