uni-app 安卓的webview使用uni.navigateBack只返回一个页面

uni-app 安卓的webview使用uni.navigateBack只返回一个页面

示例代码：

uni.navigateBack

操作步骤：

uni.navigateBack

预期结果：

uni.navigateBack

实际结果：

uni.navigateBack

bug描述：

安卓使用webview加载一个url经过多次跳转后，使用uni.navigateBack只能一级一级的返回。 但是ios是正常的。 官方又不让用plus.webview.close()关闭，因为这样关闭之后上个页面无法监听返回事件

开发环境 版本号 项目创建方式
Windows 3.1.22.20210709 HBuilderX

更多关于uni-app 安卓的webview使用uni.navigateBack只返回一个页面的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

另外在ios中 使用wv.back()之后会刷新上个页面，但在安卓中不会

更多关于uni-app 安卓的webview使用uni.navigateBack只返回一个页面的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 中，安卓 WebView 使用 uni.navigateBack 只能逐级返回的问题，通常与 WebView 栈管理机制有关。以下是关键点：

  1. 平台差异：iOS 的 WebView 栈管理更接近浏览器行为，支持多级返回；而安卓 WebView 默认将整个 WebView 视为一个页面单元，uni.navigateBack 仅能退出当前 WebView，导致逐级返回。

  2. 替代方案：虽然官方不建议直接使用 plus.webview.close()，但可通过以下方式优化：

    • 在 WebView 页面内，通过 uni.postMessage 与原生页面通信，由原生页面控制返回逻辑。
    • 使用 uni.$emit 和 uni.$on 监听 WebView 内的事件，触发 uni.navigateBack 时传递参数，实现自定义返回逻辑。

  3. 代码调整示例：

    • 在 WebView 页面内，监听返回按钮事件：
      // WebView 页面内
document.addEventListener('backbutton', function() {
    uni.postMessage({ data: { action: 'navigateBack' } });
}, false);
    • 在原生页面接收消息并处理：
      // 原生页面
plus.webview.currentWebview().overrideUrlLoading({ mode: 'reject' }, function(e) {
    uni.$on('webviewMessage', function(data) {
        if (data.action === 'navigateBack') {
            uni.navigateBack({ delta: 2 }); // 自定义返回级数
        }
    });
});
回到顶部