安卓谷歌浏览器全屏打开HTML

2024-06-09 00:44| 来源: 网络整理| 查看: 265

一开始打算，将vue项目嵌入到webview中，发布到大屏设备

页面中有地图拖拽等功能，使用crosswalk嵌入后，交互变的很卡顿

腾讯X5和Chrome内核都有试过，crosswalk也不在维护

安卓工程师最近也很忙，没有时间去做这个事情

后来想，干脆曲线救国

在大屏上直接下载浏览器，让浏览器全屏

用了两种方式

第一个：

添加meta标签，打开谷歌浏览器点击添加到主屏幕，重新启动，实现自动全屏。

解释：

具备网络应用功能意味着在以下情况下我们的内容可以正常工作：

没有网址栏屏幕上没有后退或前进按钮（在Android上，无论如何我们将始终具有软/硬后退按钮）没有重新加载按钮，因此所有内容均应由应用管理。如果我们更改内容以获取更新，则用户将需要等待直到操作系统将其从内存中删除为止，才能从“近期应用程序”列表中删除该应用程序，或者我们可以提供自己的重新加载按钮。除了方向更改外，视口也不会更改（例如工具栏的出现/消失）

附查阅链接：

https://stackoverflow.com/questions/4617073/meta-tag-apple-mobile-web-app-capable-for-android?r=SearchResults

http://www.mobilexweb.com/blog/home-screen-web-apps-android-chrome-31

第二个：

第一种方式，对于我本地访问页面，使用file地址解析后，谷歌浏览器的“添加到主屏幕”选项不见了，不太清楚原因，可能和本地文件或者地址有关系

launchFullscreen() { let element=document.documentElement; if(element.requestFullscreen) { element.requestFullscreen(); } else if(element.mozRequestFullScreen) { element.mozRequestFullScreen(); } else if(element.webkitRequestFullscreen) { element.webkitRequestFullscreen(); } else if(element.msRequestFullscreen) { element.msRequestFullscreen(); } } element.requestFullscreen()（目前在 Chrome、Firefox 和 IE 中添加前缀）：以全屏模式显示元素。document.exitFullscreen()（目前在 Chrome、Firefox 和 IE 中添加前缀。 Firefox 改用 cancelFullScreen()）：取消全屏模式。document.fullscreenElement（目前在 Chrome、Firefox 和 IE 中添加前缀）：如有任何元素处于全屏模式，返回 true。

备注：很多方法异曲同工，但不能自动触发，只能主动触发。

最后的解决方案：

更换系统的webview嵌入H5，完成全屏定时开关机和远程升级等功能

建议：类似谷歌浏览器明文禁止的规定，非用户主动全屏的操作，不要浪费时间！

【本文地址】

公司简介

联系我们