uni-app webview中如果网站有requestFullscreen功能会导致uni异常
uni-app webview中如果网站有requestFullscreen功能会导致uni异常
| 开发环境 | 版本号 | 项目创建方式 |
|---|---|---|
| Windows | windows11 | HBuilderX |
产品分类:uniapp/App
PC开发环境操作系统:Windows
手机系统:Android
手机系统版本号:Android 15
手机厂商:小米
手机机型:平板
页面类型:vue
vue版本:vue3
打包方式:云端
示例代码:
if (bol) { let de = document.documentElement if (de.requestFullscreen) { de.requestFullscreen() } else if (de.mozRequestFullScreen) { de.mozRequestFullScreen() } else if (de.webkitRequestFullScreen) { de.webkitRequestFullScreen() } } else { if (document.exitFullscreen) { document.exitFullscreen() } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen() } else if (document.webkitExitFullscreen) { document.webkitExitFullscreen() } }
更多关于uni-app webview中如果网站有requestFullscreen功能会导致uni异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html
应该用uni的全屏,而不是webview的全屏。uni-app是plus的api控制。uni-app x是pages.json控制
更多关于uni-app webview中如果网站有requestFullscreen功能会导致uni异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html
webview里面是网站呀
在 uni-app 的 Webview 中使用 requestFullscreen 确实可能导致应用异常,这是因为 Webview 容器与全屏 API 的兼容性问题。Webview 本身对全屏操作的限制,以及 uni-app 框架的页面管理机制,可能引发页面渲染错误或应用崩溃。
建议通过以下方式解决:
-
避免直接调用全屏 API:在 Webview 内嵌的网页中,尽量不要使用原生的
requestFullscreen,可以改为自定义全屏样式(例如通过 CSS 模拟全屏效果)。 -
使用 uni-app 的全屏方案:如果需要全屏功能,可以通过 uni-app 的 API(如
plus.navigator.setFullscreen)来控制 Webview 容器的全屏状态,而不是在网页内部直接调用全屏。 -
异常捕获:在调用全屏 API 前,添加 try-catch 块来捕获可能的异常,避免应用崩溃。
示例修改代码:
if (bol) {
try {
let de = document.documentElement;
if (de.requestFullscreen) {
de.requestFullscreen();
}
// 其他前缀方法...
} catch (error) {
console.error('全屏请求失败:', error);
}
} else {
try {
if (document.exitFullscreen) {
document.exitFullscreen();
}
// 其他前缀方法...
} catch (error) {
console.error('退出全屏失败:', error);
}
}

