我的网络应用程序使用"长轮询"方法来跟踪我服务器的最新数据.服务器只有在有新数据时才会响应,这可能相隔很多分钟.(这是一个加热控制系统,您只能在室温变化或有人更改设置时看到更新).
var version = "0";
function updater() {
$.ajax({
type: "POST",
url: "/listen",
data: version,
success: function (data) {
version = handleUpdates(data);
updater();
},
error: function () {
setTimeout(updater, 1000);
}
});
}
Run Code Online (Sandbox Code Playgroud)
除了一种情况外,它在桌面浏览器和手机上运行良好.我发现在带有Chrome的Android手机上,在手机进入睡眠状态超过10分钟后会发生奇怪的事情.邮件请求似乎被删除,我认为这是合理的,因为手机是睡着了.在Chrome调试器的"网络"选项卡中,POST请求的状态文本显示(已取消).
问题是当我取消请求时唤醒手机,调用success()或error()函数,我的Web应用程序永远不会更新.$ .ajax()已经违背了给我回电话的承诺.
问题只发生在某些设备上.我已经能够通过借用朋友的设备进行一些临时测试.到目前为止,我只看到Android手机上的问题.但不是手机连接到充电器.我没有在任何平板电脑,苹果设备或Windows PC上看到它.
我尝试在ajax设置中添加超时:
timeout: 120 * 1000,
Run Code Online (Sandbox Code Playgroud)
这有帮助,因为error()函数最终在唤醒后最多调用2分钟.但我希望用户在1或2秒内看到更新.我不想让超时这么短,因为它会产生不必要的服务器流量.
我还尝试通过查找一秒钟setInterval中的迟到来检测设备是否处于睡眠状态,如任何桌面浏览器都可以检测到计算机何时从睡眠状态恢复?.当我检测到唤醒时,我中止()帖子并启动另一个.这在大多数情况下都有帮助 但事实证明这是不可靠的.有时时间事件似乎在睡眠期间保持正常滴答,并且无论如何都会取消后期请求.它并不像一个可靠的解决方案.
我使用的是最新版本的jQuery:(2.1.2)和Chrome(47).
有两种类型的缩放。您在移动浏览器上获得的“捏缩放”,其中内容从屏幕边缘消失。以及您在桌面浏览器上获得的“页面缩放”,就像您按 Ctrl + 时一样。在“页面缩放”之后,页面会重新流动,因此在响应式布局中,您仍然可以看到整个页面宽度。
如何允许用户在移动设备上“页面缩放”?
我想我网站的标题栏上可能有一个 Zoom + 和 Zoom - 按钮。我想要这个是因为我有一个大多数用户都喜欢的网络应用程序,无论是在桌面浏览器还是移动浏览器上。但是一些能力较差的用户发现该网站在他们的某些移动设备上既小又繁琐。捏合缩放的功能(我没有禁用)是一种帮助,但这意味着不断放大和缩小以导航。
我尝试过涉及 CSStransform: scale(...)和 HTML 的解决方案,并<meta name="viewport" ...>从 JavaScript 更改这些。但这些似乎都有“捏缩放”效果,而不是我所追求的页面缩放。也transform: scale(...) 会导致基于js/基于像素的交互类型出现问题,例如我使用的draggable。
我还研究过从 JavaScript 改变 CSS 字体大小。但这仅适用于文本,不适用于图像<div>等。