uni-app - App 平台内嵌网页物理手机自带返回键失效解决方案(内嵌的 webview 网页 H5 打包后手机物理返回键无效直接退出应用了)

这篇具有很好参考价值的文章主要介绍了uni-app - App 平台内嵌网页物理手机自带返回键失效解决方案(内嵌的 webview 网页 H5 打包后手机物理返回键无效直接退出应用了)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

当您需要打包 App(*.apk) 平台时,发现内嵌的 H5 页面虽然可以正常显示与运行,但是手机的物理返回键却无法使用,当点击手机物理返回按键(或手势)时,直接显示 “再按一次退出应用”,而 并非返回上一个"网页"。


出现这种情况的原因是,内嵌的网页与您的 App “毫无关联”,虽然您通过 <webview> 嵌套进去了,但网页不归你 App 管理,所以你无法控制其返回与前进。

但是我们可以通过技术手段让其可控,并且自动更新标题栏(可自定义样式),

本文将带您一路复制,从 0-1 完成如下图所示功能,到时候替换成您自己的网页即可。

uni-app - App 平台内嵌网页物理手机自带返回键失效解决方案(内嵌的 webview 网页 H5 打包后手机物理返回键无效直接退出应用了)

注意看标题变化与点击返回按钮的变化。

第一步

首先我们先来实现嵌套 webview 页面,并且开启手机物理按键返回上一页功能。

您随便找个页面,一键复制以下内容。文章来源地址https://www.toymoban.com/news/detail-485519.html

到了这里,关于uni-app - App 平台内嵌网页物理手机自带返回键失效解决方案(内嵌的 webview 网页 H5 打包后手机物理返回键无效直接退出应用了)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uni-app实现 app 小程序 手机端H5扫码功能

    首先 扫码这个功能小程序和App都是有现成的方法 但是H5是不行的 我们可以看这样一段代码 这里 我们用了条件编译 App和小程序中的代码是 一样的 他们都可以正常执行scanCode进行扫码 至于H5手机端界面 我用web-view套了个百度的链接进来 其实 大家可以参考我的文章 vue实现二维

    2024年02月11日
    浏览(63)
  • uni-app 之 跨平台开发

    原生开发 优点 性能稳定,使用流畅,用户体验好、功能齐全,安全性有保证,兼容性好 ,可使用手机所有硬件功能等 缺点 开发周期长、维护成本高、迭代慢、部署慢、新版本必须重新下载应用 不支持跨平台,必须同时开发多端代码 跨平台开发 优点 可以跨平台, 一套代码

    2024年02月12日
    浏览(165)
  • uni-app在小米手机上运行【步骤细节】

    注意细节重点: 1.手机使用数据线与电脑连接,手机连接模式必须是传输文件模式 2.手机必须打开开发者模式 3.打开开发者模式后,仔细浏览并调整USB调试权限,重点打开USB是否允许安装按钮!!! 操作步骤: 1.下载HBuildX 2.打开创建项目 3.从工具栏选择\\\"运行\\\" 4.选择运行到

    2024年02月15日
    浏览(61)
  • 在uni-app中使用手机号一键登录

    https://dev.dcloud.net.cn/uniLogin 开通一键登录服务, 获取关键最关键的两个参数  ApiKey  和  ApiSecret 真机调试无需添加应用,如需打包使用请添加。一键登录应用ID为离线打包时配置的appid https://unicloud.dcloud.net.cn/home      新建云函数后会有一个index.js【 getPhoneNumber/index.js 】生成,

    2023年04月23日
    浏览(35)
  • uni-app获取系统信息(手机牌子、手机型号、屏幕宽度、屏幕高度)

    如下 官网链接:系统信息的概念 | uni-app官网 

    2024年02月12日
    浏览(51)
  • uni-app去除手机的状态栏(像电量、信号、时间等)

    一、 uni-app自定义导航栏时,导航内容会和手机自带的状态栏相重叠,为了解决这个问题可以这样: 二、uni-app手机进入时配置横/竖屏,可以这样设置:

    2024年02月16日
    浏览(45)
  • uni-app开发小程序使用uni.chooseMedia选择图片,安卓手机无法选择图片

    一、在小程序中,选择图片并上传,是一个很常见的功能; 二、最近在开发中,使用 uni.chooseMedia 来做选择图片功能时,苹果手机是正常的,安卓手机打不开!!!代码如下: 就这点屁代码,苹果手机可以正常打开选择图片的功能,安卓手机没法打开!!! !!!! 我百思

    2024年02月16日
    浏览(46)
  • uni-app App和H5平台上传视频截取视频第一帧生成图片

    提示:因为uni-app中renderjs仅支持App和H5平台,所以该方案仅支持当前这两个平台。 this.request为本人封装的接口请求方法,可以替换成个人的接口请求方法,如有需要可在下方留言 因为uni-app App端没有dom概念,不支持dom操作,并且uni-app的canvas不支持绘制video。renderjs完美解决了

    2023年04月09日
    浏览(57)
  • uni-app实现跨端开发手机蓝牙接收和发送数据

    最近接触uni-app夸终端开发手机蓝牙模块的接收和发送数据功能, 手机蓝牙模块接发收数据主要流程步骤如下: 1、初始化手机蓝牙 2、根据设备id获取蓝牙服务, 3、根据蓝牙服务获取对应的蓝牙特征值 4、监听蓝牙特征值数值变化,发送对应数据到蓝牙特征值 具体

    2024年02月12日
    浏览(48)
  • uni-app多选select组件,兼容多平台小程序、H5

          目录 介绍 平台差异说明 使用方式 安装 引入 基本使用 默认选中项(回显) 配置label、value对应的key名称 获取点击确认后的结果 完整示例 API Props Option Attributes Slot Events 多选select组件目前只支持多选,单选请用单选select组件 支持配置段 兼容多平台小程序、H5

    2024年02月09日
    浏览(113)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包