javascript 手机屏幕关闭时运行 HTML5 移动应用程序?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15465242/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML5 mobile app running while phone screen is off?
提问by tborenst
I'm interested in creating an HTML5 geolocation-based web app that could still be operating when the phone screen is off (say, tracking how far you've been running when your phone is in your pocket).
我有兴趣创建一个基于 HTML5 地理定位的 Web 应用程序,该应用程序在手机屏幕关闭时仍然可以运行(例如,当您的手机放在口袋里时,跟踪您已经运行了多远)。
Is there any way to keep the app running but have the screen be off, or have the app run in the background while other apps are being used? Is this possible at least on some of the popular mobile devices out there (newer iOS and Android devices in particular?)
有什么方法可以让应用程序保持运行但屏幕关闭,或者在使用其他应用程序时让应用程序在后台运行?这至少在一些流行的移动设备上是可能的(尤其是较新的 iOS 和 Android 设备?)
采纳答案by moodboom
My music appis HTML5 and also needs to run in the background. The support for that varies depending on mobile browser.
我的音乐应用程序是 HTML5,也需要在后台运行。对此的支持因移动浏览器而异。
- Safari on iOS: will continue to play one or two songs in the background
- Native browser on Android: will play one song then stops
- Firefox on Android: will stop when screen locks or browser loses focus or song ends
- Dolphin on Android: plays in background! but eventually stops
- Opera on Android: better background support, Javascript continues to run and music continues to play even when screen is off or Opera is sent to the background, but eventually stops after a couple songs.
- iOS 版 Safari:将继续在后台播放一两首歌曲
- Android 上的本机浏览器:将播放一首歌曲然后停止
- Android 版 Firefox:将在屏幕锁定或浏览器失去焦点或歌曲结束时停止
- Android 上的 Dolphin:在后台播放!但最终停止
- Android 上的 Opera:更好的后台支持,即使屏幕关闭或 Opera 被发送到后台,Javascript 仍会继续运行并且音乐会继续播放,但最终会在播放几首歌曲后停止。
As you can see it's hit or miss. Half the time I end up trying to put my phone in my pocket backwards, trying to keep the screen on, until I accidentally press it - totally sucks. I long for the day when the user has more control over running HTML5 apps in the background. If I had to guess I would say that universal support for that is very far off, if it ever even gets traction. I'm being forced toward a native app solution even though I am almost positive Apple will never approve it. In the meantime, I'll remain hopeful and keep testing the latest mobile browsers. Because if it actually happens it will be awesome. :-)
正如你所看到的,它是命中还是未命中。有一半的时间,我最终试图将手机向后放入口袋,试图让屏幕保持开启状态,直到我不小心按下了它 - 完全糟糕透了。我渴望有一天用户可以更好地控制在后台运行 HTML5 应用程序。如果我不得不猜测,我会说对它的普遍支持还很遥远,如果它甚至得到牵引的话。我被迫采用原生应用解决方案,尽管我几乎肯定 Apple 永远不会批准它。与此同时,我将保持希望并继续测试最新的移动浏览器。因为如果它真的发生了,那将是非常棒的。:-)
I should also point out that, in my experience, for pretty much all of the above combinations, using HTML5 to simultaneously run javascript, pull network data, and play music will typically turn your phone into an oven and kill your battery pretty quickly. Ugg.
我还应该指出,根据我的经验,对于几乎所有上述组合,使用 HTML5 同时运行 javascript、提取网络数据和播放音乐通常会将您的手机变成烤箱并很快耗尽电池电量。乌格。
In addition, if you are using jQuery Mobile (which is mostly fantastic), you will see different touch handling on the different browsers. For example, Firefox touch works great, Dolphin is terrible and requires precise touch-and-hold-and-release to get right. That's not directly HTML5's fault, but another issue I'm dealing with.
此外,如果您使用 jQuery Mobile(这非常棒),您会在不同的浏览器上看到不同的触摸处理。例如,Firefox touch 效果很好,Dolphin 很糟糕,需要精确的触摸并保持和释放才能正确使用。这不是 HTML5 的直接错,而是我正在处理的另一个问题。
Here are another developer's interesting thoughtson mobile HTML5.
以下是另一位开发人员对移动 HTML5的有趣想法。
UPDATE: I just (May 22, 2013) downloaded Opera on my Samsung Galaxy S3 and it has the best HTML5 support so far. For my app, it continues to run javascript in the background, whether the screen is off, or Opera is pushed to the background, for at least a couple songs.
更新:我刚刚(2013 年 5 月 22 日)在我的三星 Galaxy S3 上下载了 Opera,它拥有迄今为止最好的 HTML5 支持。对于我的应用程序,它会继续在后台运行 javascript,无论屏幕是关闭的,还是 Opera 被推到后台,至少有几首歌曲。
回答by Omer Gurarslan
You can use Service Workers:
您可以使用服务工作者:
https://developers.google.com/web/fundamentals/primers/service-workers/
https://developers.google.com/web/fundamentals/primers/service-workers/
A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction. Today, they already include features like push notifications and background sync. In the future, service workers might support other things like periodic sync or geofencing.
Service Worker 是浏览器在后台运行的脚本,与网页分开,为不需要网页或用户交互的功能打开大门。今天,它们已经包含推送通知和后台同步等功能。将来,Service Worker 可能会支持其他功能,例如定期同步或地理围栏。
To be precise, applications can register a service worker as follows:
准确地说,应用程序可以按如下方式注册 Service Worker:
if ('serviceWorker' in navigator) {
window.addEventListener('load', function() {
navigator.serviceWorker.register('/sw.js').then(function(registration) {
// Registration was successful
console.log('ServiceWorker registration successful with scope: ', registration.scope);
}, function(err) {
// registration failed :(
console.log('ServiceWorker registration failed: ', err);
});
});
}
Once the service worker registration is successful, any application logic implemented in sw.js will execute in the background; even if application tab is disabled.
service worker注册成功后,sw.js中实现的任何应用逻辑都会在后台执行;即使应用程序选项卡被禁用。