前言 现在多数项目中会有使用webView的情况,过去往往使用UIWebView解决问题,但是由于其各种不便,给开发者带来了很多麻烦。...现在项目中有所使用,所以写一篇总结,方便以后用到了查找和使用也为了方便其他同行。...正文 基础使用 ---- 构建和配置 WKWebView是继承自UIView的,因此构建方式还是很老套的,通常 - (instancetype)initWithFrame:(CGRect)frame...:(NSError *)error //加载报错,通常来说如果页面出现不存在等问题,会走这里,如果需要对空白页面进行处理,在这里处理 - (void)webView:(WKWebView *)webView...限制用户选择以及长按操作 ---- 有时候,我们会遇到一个比较头疼的问题,我们不想让用户长按选择或者有弹窗,那么这时我们需要添加两行代码来禁止这一系列行为。
全景图在项目中的使用,可参考官方例程“全景图”。 地图 地图列表是CityBuilder中创建的地图场景列表。移动鼠标,可查看各地图的详细信息,双击引用该地图。...移动鼠标,可查看各图表模板的预览图,双击即可为当前项目新增图表模板。 空白图表 点击“空白图表”,可为当前项目新增图表模板。...新增成功后,可在当前项目中找到cht文件,右键可在菜单中选择“编辑图表”、“重置图表”、“删除图表”和“启动预览”功能 界面 界面列表提供了包括“按钮”、“开关”、“进度条”等常用的界面模板,移动鼠标...,可查看各界面模板的预览图,双击即可引用至当前项目中。...移动鼠标,可查看各动态背景模板的预览图,双击即可引用至当前项目中。 引入动态背景后执行,效果如下图所示:
库加载并使用, UIWebView 中限制了; WKWebView 目前缺少关于页码相关的 API; WKWebView 提供加载网页进度的属性; WKWebView 使用 Safari 相同的 JavaScript...在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...WKWebView 页面样式问题 在 WKWebView 适配过程中,我们发现部分 H5 页面元素位置向下偏移或被拉伸变形,追踪后发现主要是 H5 页面高度值异常导致。...,导致crash; 另一种情况是在 WKWebView 一打开,JS就执行 window.alert(),这个时候由于 WKWebView 所在的 UIViewController 出现( push...的强制类型转换错误,从而导致你应用崩溃。
WKWebView+UITableView混排 做内容展示页的时候,经常会用到WKWebView+UITableView的混排功能,现在此做一个总结,该功能的实现我采用了四种方法。...简书的内容页实现方案 : UIWebView与UITableView的嵌套方案 将 tableView 加到 webView.scrollView 上, webView 加载的HTML最后留一个空白占位...webView的最大高度为屏幕高度,当内容不足一屏时,高度为内容高度。和方案2类似,但是不需要插入占位Div。...item.center.y]; lastCenterY = item.center.y; }; //注意,self.inertialBehavior 的修饰符是weak,惯性力结束停止之后,会释放...的使用、WKWebView+UITableView混排、UIScrollView实现原理、WKWebView离线缓存功能 等更多内容都在 https://github.com/wsl2ls/iOS_Tips
在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...WKWebView loadRequest 问题 在 WKWebView 上通过 loadRequest 发起的 post 请求 body 数据会丢失,同样是由于进程间通信性能问题, HTTPBody...WKWebView 页面样式问题 在 WKWebView 适配过程中,我们发现部分 H5 页面元素位置向下偏移或被拉伸变形,追踪后发现主要是 H5 页面高度值异常导致。...,导致 crash; 另一种情况是在 WKWebView 一打开,JS就执行 window.alert(),这个时候由于 WKWebView 所在的 UIViewController 出现( push...的强制类型转换错误,从而导致你应用崩溃。
在UIWebView上当内存占用太大的时候,app process会crash;而在WKWebView上当总体的内存占用比较大的时候,webContent process会crash,从而出现白屏现象。...不足:使用post方式的请求该方案依然不适用,同时需要H5侧修改请求scheme以及CSP规则; 最近了解到QQ浏览器团队已经解决了registerSchemeForCustomProtocol 导致post...4、WKWebView loadRequest问题 在WKWebView上通过loadRequest发起的post请求body数据会丢失: //同样是由于多进程间通信性能问题,导致HTTPBody字段被丢弃...= a,那么contentSize.height的值会增加a,导致H5页面长度增加,页面元素位置向下偏移;解决方案是调整WKWebView布局方式,避免调整webView.scrollView.contentInset...的浏览器也存在同样的问题:对webGL页面的截屏结果不是空白就是纯黑图片。
在 UIWebView 上当内存占用太大的时候,App Process 会 crash;而在 WKWebView 上当总体的内存占用比较大的时候,WebContent Process 会 crash,从而出现白屏现象...3、WKWebView NSURLProtocol问题 WKWebView 在独立于 app 进程之外的进程中执行网络请求,请求数据不经过主进程,因此,在 WKWebView 上直接使用 NSURLProtocol...即便将Allow Arbitrary Loads in Web Content 选项设置为YES); WKWebView 可以注册 customScheme, 比如 dynamic://, 因此希望使用离线功能又不使用...= a,那么contentSize.height的值会增加a,导致H5页面长度增加,页面元素位置向下偏移; 解决方案是:调整WKWebView布局方式,避免调整webView.scrollView.contentInset...的浏览器也存在同样的问题:对webGL 页面的截屏结果不是空白就是纯黑图片。
之前在项目中使用过WebViewJavascriptBridge,使用起来很简单,但是这次项目中没有使用。只用了原生的WKWebView。这里就不具体讲怎么使用WKWebView。...思路: 1.写一个自定义的webVIew继承WKWebView。用于初始化和增加进度条(UIProgressView) 2.写一个Web通用的ViewController。处理各种逻辑。...所以后来采用和js交互的方式进行跳转 2.iOS给JS提供了一个页面返回的方法,但是在测试过程中发现,这个方法会无限调用,导致页面一直pop; 调用的结果是因为iOS这边使用了一个通用的页面,比如两个页面一个页面是...H5Controller的,初始化的时候都注册了handleBack方法,而H5那边把这个handleBack方法写成全局的了,所以我返回ViewController1的时候也在调用handleBack,所以会无限的调用...但是如果定位返回很快,但是访问H5那边慢就会导致JS方法在没有注册的情况下就调用了JS所以没有效果。解决方法是定位成功和H5交互但是在WebView加载完成后再调用一次交互。这样就没有问题了。
我目前使用的是 Vivado 2019.1、2020.2,但据我所知,此功能几乎适用于 Vivado 的所有版本(如果不正确,请随时在后台更正)。...使用 Flow Navigator 中的Add Sources选项并选择Add or create design sources ,然后单击 Next。...Flow Navigator 窗口中的Create Block Design选项,将新的Block Design添加到项目中。...将 RTL 模块添加到Block Design 要添加我们在上一步中创建的 D 触发器的 RTL 模块,右键单击 Diagram 窗口空白处的任意位置,然后选择Add Module...选项。...Vivado 将自动显示它在当前项目中找到的所有有效 RTL 模块。由于写入或导入到当前项目中的模块是我们刚刚设计的 D 触发器,因此它是本例中的唯一选项。
WKWebview刚推出时,在IOS8.0~8.2会偶尔出现白屏 由于滚动组件嵌套的结构,不刷新的问题。 针对原因3,解决的方案是判断IOS系统版本,小于8.2的使用UIWebView。...再比如我们在某一刻操作了某个比较大的变量,可能在短时间内,内存使用量也会飙升。同样的,对于导致Android WebView白屏的问题,绝大部分也只能由小程序团队去解决。...这样一来,从开发小程序应用的前端角度来说,我们能够把握的是尽量避免由于内存使用紧张导致的部分WebView被回收而出现的白屏问题。至此,我们研究的小程序白屏问题,可以转向对小程序内存优化的研究。...下面总结一下平时开发过程中可能会导致内存警告的操作: 使用大图片和长列表图片。根据小程序团队分析过的大部分案例,大图片和长列表图片的使用,都会引起WKWebview被回收[10]。...假设在某个时间点,我们需要对接口返回的大量数据进行操作,可能会造成瞬时的内存占用。 列表数据的持续累加,导致某个数据异常大。
(在 iOS 中使用的是 WKWebView)的加载速度,内存使用情况。...的数据就是加载 sina 主站的时间;UIWebViewA 的数据是因为在加载完 sina 主站之后,新浪又加载了一个https://r.dmp.sina.cn/cm/sinaads_ck_wap.html,所以导致总时间延长...就不推荐使用了; WKWebView: 速度略慢一点,不过差别不大,总体可以接受。...是比UIWebView更好的选择,推荐使用; flutter_webView_plugin:在iOS中使用的就是原生的WKWebView,所以总体和 native WKWebView 表现差不多。...如果是混编项目中,因为它被包了一层,所以页面加载上存在一定的劣势,所以混编项目中仍然推荐使用 WKWebView。
6,WKWebView是多进程组件,这意味着会从APP内存中分离内存到单独的进程中。...当用户不能在某个方向上再移动时,使用canGoBack或者canGoForward来禁用按钮。 默认情况下,Web视图会自动将出现在Web内容中的电话号码转换成电话链接。...导航到后退列表中的某一个网页项,并将其设置为当前项。 - loadRequest:。导航到请求的URL地址。...一般而言,但WKWebView因一些稀奇古怪的原因导致Crash的时候就会回调该方法。...5,使用WKWebView的流程如下: ?
概括来讲: 为了避免 iphoneX 的刘海和底部出现空白,苹果已经把 viewport-fit 增加到了 CSS Round Display 规范中。...通过设置 viewport-fit 的值让 viewport 填充满整个屏幕。 为了避免填充满屏幕后页面内容被刘海底部挡住,使用 env 函数设置 padding 值。...他们引入了 User Agent properties 的概念,用来在 css 中使用用户代理提供的变量,比如 safe-area-inset-left 等,参考 [css-variables] User...constant 方法,最后 CSS 工作组讨论后变更为 env 方法,所以在 IOS 11 中,仅支持 constant,而在 iOS 11.2+ 中移除了 constant,替换为 env env 支持使用...like Mac OS X/i)[1]); // Detect if device is running >iOS 11 // iOS 11's UIWebView and WKWebView
UIWebView VS WKWebView 稳定性: UIWebView较多的WebCore、JavaScriptCore Crash,以及系统性的内存泄露导致OOM,对整个App的稳定性都是极大的隐患...反观WKWebView,基于独立进程,不会占用App的内存计算,同时也不会导致主App Crash。所以在系统级的稳定性上,WKWebView有着极大的优势。...无需解决的问题: 对于新闻类App内容页的使用场景,一些WKWebView的问题并没有必要形成通用的解决方案以兼容代码。...遗留问题: 目前,在使用WKWebView的过程中,唯一未解决的问题就是可靠、全面的白屏检测方案,从而支持WKWebView在任何情况下的Crash进行重载。...无论使用哪个开源图片库,在缓存策略上,尽量将内容页图片的缓存策略与其他的有所区分,或者使用 LRU + FIFO 的缓存策略,避免进入内容页大量图片占用缓存空间,导致列表图片释放。
,不做深究 WKWebView是iOS8中推出的,算是UIWebVeiw的升级版。... 创建个WebView的对象 WKWebView *webView = [[WKWebView...self.mywebView.scrollView.bounces =NO; 3.自动对页面进行缩放以适应屏幕 self.mywebView.scalespageToFit = YES; 4....而且这个 WebViewJavascriptBridge 会劫持掉 - (void)webViewDidFinishLoad:(UIWebView *)webView {}这个回调方法,在当前的VC中不会触发...这里解决的方法是通过使用 WKWebView 的方法。
1.1 UIWebView 监听H5页面goBack返回事件 1.2 WKWebView监听H5页面goBack返回事件 2.1 原理 2.2 例子 什么时候会触发这个返回事件?...截取当前显示在屏幕中的WKWebView UINavigationBarDelegate NavigationType Disable all the '_blank' target in page's...target 在WKWebView的WKNavigationDelegate代理方法中处理应用跳转 简单的处理WKWebView加载新页面 WKWebView显示JS弹框 WKWebView调用js方法...监听 estimatedProgress 引言 需求:原生app使用WebView 控制器加载H5页面进行信用卡申请 问题:用户点击残忍放弃之后,没有关闭当前控制器 重现场景:用户点击返回按钮,暂时提示框...解决方案: 1、iOS监听H5页面goBack返回事件 2、直接使用Safari打开URL 相关文章: iOS 封装WebView 控制器https://kunnan.blog.csdn.net/article
根据需求需要将老项目中的 WebView 替换成 WKWebView,期间查阅了不少文档和资料,之前也发布了几篇 WKWebView 相关的优秀文章。...WKWebView 几个不常用的特性 WKWebview 加载过程中的性能指标图解 WKWebview 秒开的实践及踩坑之路 今天分享的这篇文章全面的介绍了 WKWebView,作者根据开发和使用经验从属性...当一个 WebView初始化,一个新的 Web 内容进程会从一个特殊的进程池中创建,或者一个已存在的进程会被使用。...UIAlertController 作为对接,则要考虑控制器是否存在,是否有并发的弹出窗操作,因为这些会导致 UIAlertController弹不出来,最终可能在逻辑上造成 completionHandler...无法执行导致崩溃,最好建议弹窗应该使用 UIView 设计。
原生控件可以提供H5控件无法实现的一些功能,原生控件的用户体验感受上也会更加流畅,另外,使用原生控件减少了Objective C代码与WebView通信的流程,降低了通信开销。...insertCanvas通知客户端,在当前WebView上插入一个画布控件,客户端根据传入的位置和宽高参数来决定插入控件的位置和大小; 当开发者改变了wx-canvas控件的位置大小时,通过updateCanvas...原生控件插入到WKWebView后将覆盖控件树中的HTML节点) 如上图,插入的原生控件必然总是盖住网页(节点树中越靠下的节点,显示层级越高),这样就会导致: 1 如果开发者期望在原生控件上覆盖一些自定义...为了解决这一问题,客户端尝试对WKWebView解析HTML元素的原理进行分析,WKWebView在进行HTML解析时,会根据页面DOM元素在WKWebView控件下生成对应的iOS原生控件,通过分析,...由于WKWebView会接管用户的所有操作事件,因此按照上述方案插入后,原生控件是无法响应用户事件的。
领取专属 10元无门槛券
手把手带您无忧上云