首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

升级到WKWebView Ionic 3后iOS应用程序闪屏后出现白屏

是由于WKWebView在加载页面时的一些特性导致的。WKWebView是iOS 8及以上版本引入的新的Web视图组件,相比于之前的UIWebView,它具有更好的性能和功能。

在升级到WKWebView后,出现白屏的问题可能是由于以下几个原因导致的:

  1. 缺少配置:在升级到WKWebView后,需要进行一些额外的配置才能正常加载页面。首先,确保已经在项目的config.xml文件中添加了以下配置:
代码语言:txt
复制
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />

此外,还需要在项目的AppDelegate.m文件中添加以下代码:

代码语言:txt
复制
#import <WebKit/WKWebView.h>
#import <Cordova/CDVViewController.h>

@implementation AppDelegate

- (BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions
{
    // ...

    // 添加以下代码
    CDVViewController* viewController = (CDVViewController*)self.viewController;
    viewController.webViewEngine = @"CDVWKWebViewEngine";

    // ...
}

@end
  1. 缓存问题:WKWebView默认启用了缓存机制,可能会导致页面加载时使用了旧的缓存数据而出现白屏。可以尝试清除应用程序的缓存,或者在加载页面时禁用缓存,以确保每次加载都是最新的页面。
  2. 插件兼容性:某些Cordova插件可能不完全兼容WKWebView,导致页面加载出现问题。可以尝试更新插件版本或者寻找替代的插件来解决兼容性问题。

综上所述,解决WKWebView升级后iOS应用程序闪屏后出现白屏的问题,可以通过配置、缓存处理和插件兼容性等方面进行调整。如果问题仍然存在,可以进一步查看错误日志或者尝试在开发者工具中进行调试,以找到具体的原因并解决问题。

腾讯云相关产品和产品介绍链接地址:

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Hybrid App 应用 开发中 9 个必备知识点复习(WebView 调试 等)

js 的交互; 注意: 大多数App需要支持 iOS7 以上的版本,而 WKWebView 只在 iOS8 才能用,所以需要一个兼容性方案,既 iOS7 下用 UIWebView ,iOS8 后用...在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...检测 webView.title 是否为空 并不是所有 H5 页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的 H5 页面上 present 系统相机,拍照完毕返回原来页面的时候出现白屏现象...WKWebView问题 WKWebView 下通过 -CALayer renderInContext:实现截的方式失效,需要通过以下方式实现截功能: @implementation UIView... 当调试项目的加载时,您的应用程序将会有一个蓝色的地方,点击会出现一个四叶三叶草的东西

3.1K00

【Hybrid】288- Hybrid App 应用开发中 9 个必备知识点复习

: 大多数App需要支持 iOS7 以上的版本,而 WKWebView 只在 iOS8 才能用,所以需要一个兼容性方案,既 iOS7 下用 UIWebView , iOS8 后用 WKWebView...在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...检测 webView.title 是否为空 并不是所有 H5 页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的 H5 页面上 present 系统相机,拍照完毕返回原来页面的时候出现白屏现象...WKWebView问题 WKWebView 下通过 -[CALayer renderInContext:]实现截的方式失效,需要通过以下方式实现截功能: @implementation UIView... 当调试项目的加载时,您的应用程序将会有一个蓝色的地方,点击会出现一个四叶三叶草的东西

2.3K20

WKWebView 那些坑

在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...:(WKWebView *)webView API_AVAILABLE(macosx(10.11), ios(9.0)); 当 WKWebView 总体内存占用过大,页面即将白屏的时候,系统会调用上面的回调函数...B、检测 webView.title 是否为空 并不是所有H5页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的H5页面上 present 系统相机,拍照完毕返回原来页面的时候出现白屏现象...在接入 now 直播的时候,我们发现在 iOS 9 上 WKWebView出现页面被拉伸变形的情况,最后发现是window.innerHeight值不准确导致(在WKWebView上返回了一个非常大的值...通过查阅相关资料发现,这个bug只在 iOS 9 的几个系统版本上出现,苹果后来fix了这个bug。

4.4K130

WKWebView 那些坑

在UIWebView上当内存占用太大的时候,app process会crash;而在WKWebView上当总体的内存占用比较大的时候,webContent process会crash,从而出现白屏现象。...:(WKWebView *)webView API_AVAILABLE(macosx(10.11), ios(9.0)); 当WKWebView总体内存占用过大,页面即将白屏的时候,系统会调用上面的回调函数...1.2、检测webView.title是否为空 并不是所有页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的H5页面上present系统相机,拍照完毕返回原来页面的时候出现白屏现象...在接入now直播的时候,我们发现在ios9上WKWebView出现页面被拉伸变形的情况,最后发现是window.innerHeight值不准确导致(在WKWebView上返回了一个非常大的值),而H5...通过查阅相关资料,这个bug只在ios9的几个系统版本上出现,苹果后来fix了这个bug。

17K21

Hybrid App 应用开发中 9 个必备知识点复习

js 的交互; 注意: 大多数App需要支持 iOS7 以上的版本,而 WKWebView 只在 iOS8 才能用,所以需要一个兼容性方案,既 iOS7 下用 UIWebView , iOS8...在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...检测 webView.title 是否为空 并不是所有 H5 页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的 H5 页面上 present 系统相机,拍照完毕返回原来页面的时候出现白屏现象...WKWebView问题 WKWebView 下通过 -[CALayer renderInContext:]实现截的方式失效,需要通过以下方式实现截功能: @implementation... 当调试项目的加载时,您的应用程序将会有一个蓝色的地方,点击会出现一个四叶三叶草的东西

2.6K20

Hybrid App 应用开发中 9 个必备知识点复习

: 大多数App需要支持 iOS7 以上的版本,而 WKWebView 只在 iOS8 才能用,所以需要一个兼容性方案,既 iOS7 下用 UIWebView , iOS8 后用 WKWebView...在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...检测 webView.title 是否为空 并不是所有 H5 页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的 H5 页面上 present 系统相机,拍照完毕返回原来页面的时候出现白屏现象...WKWebView问题 WKWebView 下通过 -[CALayer renderInContext:]实现截的方式失效,需要通过以下方式实现截功能: @implementation UIView... 当调试项目的加载时,您的应用程序将会有一个蓝色的地方,点击会出现一个四叶三叶草的东西

2.3K30

【技巧】ionic3优雅解决启动前、白屏问题

这里只说明androd和ios的情况。 1、启动前黑白屏 启动前黑白屏问题,仅存在于android,是android应用的通病,ionic表示这锅它不背。...具体操作时,当我们点击桌面图标启动APP时,有时会一下黑色背景,有时黑色背景时间还比较长。...所以解决方式有好几种,可以看这两篇文章: Android启动页优化,去黑屏实现秒启动 Android启动页黑屏及最优解决方案 具体应用在ionic上可以参照这个: 快速解决ionic安卓主题启动时短暂的黑屏或白屏问题...我们可以验证一下,执行命令运行看效果: ionic run android 2、启动白屏 ionic启动页使用了cordova-plugin-splashscreen这个插件,插件配置在应用的config.xml...statusBar.styleDefault(); splashScreen.hide(); }); } 3、其它情况 可能加了--prod参数build出现的,先看命令行的输出提示

3.5K60

WKWebView 白屏问题

初次适配 WKWebView 的时候,我们也惊讶于打开 WKWebView ,App 进程内存消耗反而大幅下降,但是仔细观察会发现,Other Process 的内存占用会增加。...在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...在 WKWebView 中加载下面的测试链接可以稳定重现白屏现象: http://people.mozilla.org/~rnewman/fennec/mem.html 这个时候 WKWebView.URL...:(WKWebView *)webView API_AVAILABLE(macosx(10.11), ios(9.0)); 当 WKWebView 总体内存占用过大,页面即将白屏的时候,系统会调用上面的回调函数...B、检测 webView.title 是否为空 并不是所有H5页面白屏的时候都会调用上面的回调函数,比如,最近遇到在一个高内存消耗的H5页面上 present 系统相机,拍照完毕返回原来页面的时候出现白屏现象

4.4K20

WKWebView

3WKWebView的内存占用大概是UIWebView的1/3~1/4,内存占用更低(可以查看该文:https://www.jianshu.com/p/181889939a85)。...但WKWebView的内存超过系统分配给它的内存的时候,WKWebView浏览器就会崩溃白屏,但是APP不会crash(APP会收到系统通知,并且尝试去重新加载页面)。...2,截捕获在WKWebView上会随机失败,因此,如果截的API是App中的关键操作,那么建议使用现有的UIWebView浏览引擎。...其他的区别如下: 1,UIWebView是UIKit框架的一部分,可以在应用程序内使用,无需导入任何内容;而WKWebView使用的是WebKit.framework,使用的时候需要导入到应用程序中。...默认情况下,Web视图会自动将出现在Web内容中的电话号码转换成电话链接。当电话链接被点击时,电话应用程序就会启动并拨打该号码。

5.9K20

《移动端本地 H5 秒开方案探索与实现》

一、为什么 H5 体验糟糕 为什么打开一个 H5 页面会有一长段白屏时间?...一般页面在 dom 渲染才能展示,可以发现,H5 首渲染白屏问题的原因关键在于,如何优化减少从请求下载页面到渲染之间这段时间的耗时。...不过我们在里面仔细再分析下,对首启动速度影响最大的就是网络请求,包括请求 HTML、css、image 等静态资源和展示数据的请求。...i18n.en : i18n.zh WKWebView 兼容 WKWebView 性能比 UIViewView 性能好很多,所以客户端开发一般都推荐使用 WKWebView。...但是使用 WKWebView 加载本地的 HTML 时也有一些兼容问题,在 iOS8 不能在 HTML 文件中引用本地的 css 或者 js 或者图片文件,IOS8 以上的是正常的,可以引用远程资源。

5.4K162

解决 APP启动白屏黑屏问题

页简介 页,我们手机上的每个 APP 几乎都有自己的页,就是在真正进入程序前,会有一个页面停顿几秒钟。其实我们完全可以充分利用好这几秒钟做很多的程序初始化了启动。...为什么我的 APP 启动会白屏或者黑屏 有时候我们会发现,我们在启动我们自己的 APP 的时候,总是有那么点时间是白屏(黑屏),经过了白屏(黑屏)才会进入我们的 APP。那么这是为什么呢?...,StartingWindow 出现应用程序进程创建并且初始化完成之前,是个临时的窗口,对应的 WindowType是 TYPE_APPLICATION_STARTING 作用就是告诉用户,系统已经收到我们的操作了...,正在对程序进行初始化,只要初始化完毕就会移除这个窗口。...黑屏就是应用了 @android:style/Theme.Black,好了到这里我们就彻底明白为什么会出现白屏或者黑屏了。

2.8K20

Ionic开发hybrid APP

toc 使用phonegap开发APP的优劣在此不必细说,快速,简单,跨平台,以及随着iOS,Android本身对webview优化所带来的不错的性能,便是其独有的优势。...$ npm install -g cordova ionic $ ionic start myApp tabs $ cd myApp $ ionic platform add ios $ ionic build...ios $ ionic emulate ios 以及私人推荐的电脑浏览器调试命令:$ ionic searve 相关插件扩展推荐 SQLite插件,如果你的APP需要持久保存用户数据,强烈推荐你使用...启动图片(或称)插件:$cordovaSplashscreen,之所以推荐也必装这个插件的原因是,默认情况下启动图片时间停留较短,如果你的APP在这段时间没有完成数据加载或者视图渲染等(需要查询SQLite...需要提示的是,安装插件,在启动图片未关闭时候,默认菊花转在屏幕中间,如果你要自定义,可以更改插件中的原生代码,以iOS为例,将其改到屏幕底部:更改/src/ios/CDVSplashScreen.m中

2.4K10

Skyline 渲染引擎——更接近原生渲染的性能体验

两种策略各有千秋,但 WebView 的策略存在一些难以规避的问题,例如:快速滚动会出现白屏问题;滚动过程中的 DOM 更新会出现不同步的问题,进而影响到用户体验。...根除旧有架构的问题在基于 Web 体系的架构下,小程序的部分基础体验会受限于 WebView 提供的能力(特别是 iOS WKWebView 限制更大一些),使得一些技术方案无法做得很完美,留下一些潜在的问题...iOS 下原生组件同层渲染的原理先前有介绍过,本质上是在 WKWebView 黑盒下一种取巧的实现方式,并不能完美融合到 WKWebView 的渲染流程,因此很容易在一些特殊的样式发生变化,同层渲染会失效...iOSWKWebView 会受操作系统统一管理,当内存紧张时,操作系统就会将不在WKWebView 回收,会使得小程序除前台以外的页面丢失,虽然在页面返回时,我们对页面做了恢复,但页面的状态并不能...小程序的首耗时可以从上一个页面的点击到下一个页面 FCP(First Contentful Paint)的时间来衡量,首性能的好坏会影响上一个页面点击时的响应速度,以及下一个页面的白屏时间。

44950

分享超详细 WKWebView 开发和使用经验

一定要在合适的时机将观察者模式移除,否则在 iOS10 以下的设备会造成崩溃,原因是 WKWebView 在释放的时候,扔被强持有观察者。...WKProcessPool 本身没有任何方法和属性,通过实现单例进程池,可以达到 WKWebView 间共享 cookie 的能力,注意:如果在账户退出登录,单例进程需要释放。...iOS 11 以上支持内容过滤规则配置 该配置需要结合内容过滤器编译一起使用,通过对 js 指定的规则编译得到一个 WKContentRuleList ,并且通过 userController 添加进...,默认为 NO,如果设置为 YES,则 H5 在加载完成之前一直处于白屏状态。...iOS 13 新增方法 contextMenu 的处理方法 contextMenu 的相关处理方法,暂时不理解在手机端有何用处。 FAQ WKWebView 中 H5 css 动画失效的问题?

4.6K30

Cocos Creator 出新版本啦, 2.1.2 圆形Shader终于可以完美解决了!

[参考链接]可点击[阅读原文]进入下载页查看 详细改动说明如下 What's New 支持 iOS 13 为了支持即将发布的 iOS 13 操作系统,我们将 iOS 原生平台上的 VideoPlayer...底层实现由 MPMoviePlayerController 替换为了 AVPlayerContoller [#1831],同时将 WebView 底层由 UIWebView 替换为了 WKWebView...3D 模型无法显示的问题[#5071] 修复某些 3D 骨骼动画渲染不全的问题 [#5349] 修复引擎初始化时可能出现 "requestAnimFrame" 相关报错的问题 [#5248] 修复动态合图在特定情况下会导致纹理边缘像素异常的问题...(感谢 unace)[#5242] 修复 Animation 的 “stop” 和 “lastframe” 在特定情况下不触发的问题[#5246] 修复加载带有 WebView 的场景,在场景切换的首帧会屏幕会一下的问题...上全屏无法返回的问题[#1800] 修复 VideoPlayer 在 Android 上播放时锁再进入会卡死的问题[#1811] 修复 cc.sys.languageCode 在 Android

3K30

React Native如何消除启动时白屏

在RN 项目启动之后有一个短暂的白屏,调试阶段白屏的时间较长,大概3-5秒,打正式包这个白屏时间会大大缩短,大多时候都是一而过,所以称之为“白”。...白屏的原因 在iOS App 中有 启动图(LaunchImage),启动图结束才会出现上述的白,这个过程是 JS 解释的过程,JS 解释完毕之前没有内容,所以才表现出白屏,那么解决的方法就是在启动图结束...解决的常见方案: 启动图结束通过原生代码加载一张全屏占位图片,跟启动图一样的图片,混淆视听“欺骗用户”。...splashImage = [[UIImageView alloc]initWithFrame:[UIScreen mainScreen].bounds]; } if (IPHONESCREEN3p5...js端代码: if (Platform.OS === 'ios') { NativeModules.SplashScreen.close(); }; 更加详细的信息可以访问:https:

1.2K70

React Native如何消除启动时白屏

在RN 项目启动之后有一个短暂的白屏,调试阶段白屏的时间较长,大概3-5秒,打正式包这个白屏时间会大大缩短,大多时候都是一而过,所以称之为“白”。...白屏的原因 在iOS App 中有 启动图(LaunchImage),启动图结束才会出现上述的白,这个过程是 JS 解释的过程,JS 解释完毕之前没有内容,所以才表现出白屏,那么解决的方法就是在启动图结束...解决的常见方案: 启动图结束通过原生代码加载一张全屏占位图片,跟启动图一样的图片,混淆视听“欺骗用户”。...splashImage = [[UIImageView alloc]initWithFrame:[UIScreen mainScreen].bounds]; } if (IPHONESCREEN3p5...js端代码: if (Platform.OS === 'ios') { NativeModules.SplashScreen.close(); }; 更加详细的信息可以访问:https:

1.9K70

一个 Hybrid SDK 设计与实现

主流容器都是这么做的,比如微信、手机百度、携程 没有 Header 一旦出现网络错误或者白屏,App 将陷入假死状态 PS:Native 打开 H5,如果 300ms 没有响应则需要 loading 组件...为了优化首体验,大部分主流的页面都会在服务器端拉取首数据通过 NodeJs 进行渲染,然后生成一个包含了首数据的 Html 文件,这样子展示首的时候,就可以解决内容转菊花的问题了。...手 Q 里面有一套自动化的构建系统 Vnues,当产品经理修改数据发布,可以一键启动构建任务,Vnues 系统就会自动同步最新的代码和数据,然后生成新的含首 Html,并发布到 CDN 上面去。...我们可以做一个类似的事情,自动同步最新的代码和数据,然后生成新的含首 Html,并发布到 CDN 上面去 离线预推 页面发布到 CDN 上面去,那么 WebView 需要发起网络请求去拉取。...registerSchemeForCustomProtocol:@"https"] 但是因为出于性能的原因,WKWebView 的网络请求在给主进程传递数据的时候会把请求的 body 去掉,导致拦截请求的

1.1K10

App 启动优化

Android APP启动时会出现白屏 由于应用程序启动时冷启动,系统会默认在启动时启动空白窗口 应用程序启动有三种状态,每种状态都会影响应用程序对用户可见所需的时间:冷启动,热启动和温启动。...这些任务是: - 加载并启动应用程序。 - 启动立即显示应用程序空白的启动窗口。 - 创建应用程序进程。 一旦系统创建应用程序进程,应用程序进程就会负责下一阶段。...为了更顺滑无缝衔接我们的页,可以在启动 Activity 的 Theme中设置页图片,这样启动窗口的图片就会是页图片,而不是白屏。...页政展示总时间 = 组件初始化时间 + 剩余展示时间。...,又要展示2000ms的页时间.)

1.3K10
领券