精华内容
下载资源
问答
  • 自上次微信安卓升级至X5 Blink内核提升性能与解决了兼容性问题后,2017年1月6日晚,微信IOS也公布了重大利好消息“微信IOS客户端将升级为WKWebview内核...

    自上次微信安卓升级至X5 Blink内核提升性能与解决了兼容性问题后,2017年1月6日晚,微信IOS也公布了重大利好消息“微信IOS客户端将升级为WKWebview内核,请网页开发者尽快适配”。对于非技术开发者而言这句话代表着什么呢?Layabox小编先抛出答案,再慢慢解读。

    升级后的好处

    一、HTML5渲染性能提升4倍。

    二、内存占用将会减少至30%。

    小编在技术哥给的性能测试链接经对比后发现,当前的微信内核UIWebView与Safari的WKWebview内核性能差距达到4倍左右。内存占用可减少于30%左右。而微信IOS客户端升级至WKWebview后使用的就是Safari当前的WKWebview内核。性能提升与内存占用的减少这对于HTML5大型游戏的研发商而言是重大的利好消息,未来HTML5游戏可以轻松实现APP游戏的效果。

    更新时间周期

    微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核。

    背景

    WKWebView 是苹果在iOS 8中引入的新组件,目的是提供一个现代的支持最新Webkit功能的网页浏览控件,摆脱过去 UIWebView的老、旧、笨,特别是内存占用量巨大的问题。它使用与Safari中一样的Nitro JavaScript引擎,大大提高了页面js执行速度。

    切换方法

    iOS微信6.5.3版本开始支持开发者手动切换WKWebview和UIWebview,使开发者可提前对WKWebview进行适配。

    手动切换入口:

    在微信会话列表页点击右上角“加号按钮”,选择菜单中的”添加朋友”,在添加朋友界面的搜索框中输入字符串:“:switchweb”,再点击键盘右下角搜索按钮。切换成功后会提示当前使用的内核是UIWebview或是WKWebview。

    校验切换方法:

    通过命令成功切换到WKWebview后,可通过以下方法验证当前网页使用的是否是WKWebview内核。 

    微信内任意入口进入任意网页,在网页加载成功后向下拉动页面(或点击网页右上角菜单按钮),使之显示出地址栏,当地址栏以 “此网页由” 开头即为当前使用WKWebview,若以“网页由”则是使用的UIWebview。

    页面如何判断当前使用的webview内核:

    在页面中可通过微信注入的window.__wxjs_is_wkwebview变量判断当前使用的webview内核。 iOS微信6.5.3及其之后的版本 window.__wxjs_is_wkwebview 为true时是使用WKWebview,为 false或者 “undefine”时是 UIWebview 。

    前端适配关注的要点

    适配的首要原则:若不能区分是WKWebview的新特性新行为还是微信内部逻辑导致原有页面出现问题时,可使用测试页面分别在Safari和微信中的WKWebview内核分别测试,用以快速定位问题产生的原因。

    适配指南

    切换为WKWebview后,微信中的Webview行为和Safari中保持高度一致,唯一的区别是微信Webview中会注入微信JSBridge相关的脚本。所以适配的重点需要关注以下几个方面: 

    一:页面功能是否正常 

    二:页面屏幕适配是否正常 三:页面行为是否正常(例如用户在浏览页面时点击返回按钮返回上一个页面时的页面逻辑是否正常) 

    四:页面使用的语法是否兼容。 

    五:JSSAPI是否正常完美的工作。 

    六:重点关注Cookie和LocalStorage等相关的逻辑是否正常。 

    七:若服务器有设置返回 Cache-Control缓存有效时间,则需要检查相关逻辑是否正常。

    正常情况下,你的页面是不需要做特别的适配,但若你的页面有涉及到以下几个受影响的逻辑,则需要根据适配建议进行适配和确认。

    JSAPI相关适配

    一:将不再支持cache 

    变化:在WKWebview中将暂不支持cache jsapi。 

    适配建议:所有使用此api的开发者可去掉页面相关逻辑。

    二:页面通过LocalID预览图片 

    变化:不再支持通过使用chooseImage api返回的localld以如:”img src=wxLocalResource://50114659201332”的方式预览图片。 

    适配建议:

    1. 在iOS微信6.5.3版本及之后的版本中,使用新增的jsapi:getLocalImgData 拿到LocalID对应的图片base64编码后再在前端页面中显示。

    2. 如果引入了页面有引入JSSDK,则直接将JSSDK升级为1.2.0最新版本即可帮助页面自动适配。(目前JSSDk线上版本是 1.0.0 和 1.1.0,更新版本为1.2.0 ,https://res.wx.qq.com/open/js/jweixin-1.2.0.js  )

    三:有使用JSSDK,并且使用了wx.config进行权限授权需关注jsapi调用的失败问题 

    变化:WKWebview的内部实现变更使我们对微信内的页面jsapi权限管理做了一定逻辑上的调整,有极小可能会发生以前授权正常的jsapi获取权限不正常,从而导致调用jsapi失败。 

    适配建议:

    1. iOS微信6.5.1,WKWebview在此版本中已知有以下问题:页面使用HTML5的History API pushState; popstate;      replaceState等控制页面导航(典型的如单应用页面),同时使用JSSDK的wx.config为jsapi授权,此时大几率会出现jsapi因为无权限而调用失败的问题。 在6.5.1中页面若可能的情况下,可使用Anchor hash技术替换History技术来解决此问题。

    2. iOS微信6.5.2及其之后版本,将不会存在以上问题,但不能100%确认有使用到 history或hash技术更改页面导航地址的页面完全没有此类问题,依然需要开发者注意关注此类问题。

    Cookie和LocalStorage设置相关

    一:退出微信账号后,将会清空所有Cookie和LocalStorage。

    二:页面功能依赖Cookie,或有涉及到Cookie的相关逻辑 

    变化:WKWebview内部实现变更,会影响目前页面Cookie相关的逻辑,例如跨域存取Cookie和页面的资源或图片存储服务器依赖校验Cookie来返回数据等情况。

    问题说明:在访问一个页面A时,如果页面A引用了另一个页面B的资源(页面A和B为不同的域名),这时页面B就认为是第三方页面。若在页面B中设置Cookie,就会命中WKWebview下阻止第三方跨域设置Cookie的安全策略,导致问题出现。

    适配建议:

    在WKWebview中是默认阻止跨域的第三方设置Cookie。所有通过Cookie传递的信息,可通过业务后台存储需要传递的信息,然后给页面一个存储信息相对应的access_token加密码,然后通过Url中加入自己业务的access_token进行页面间信息传递。

    如果页面的资源或图片存储的服务器依赖校验Cookie来返回数据的情况,在切换到WKWebview后,在微信内长按保存,或者点击预览大图时,将不会完整的带上所设置的Cookie,会导致图片保存失败或预览失败。除了此种情况,开发者不用担心其他情况下Cookie丢失的问题,所有请求都会带上完整的Cookie。

    页面视频小窗播放

    变化:iOS微信6.5.3及其之后的版本中,Webview默认支持小窗播放。 

    开发者需要特别注意小窗播放需要前端同时适配iOS10和iOS10以下的低版本 

    适配建议:需要完全按照以下代码设置video标签才可同时兼容不同的iOS版本

    <video webkit-playsinline playsinline> </video>

    WKWebview页面行为与Safari完全一致,会导致页面依赖UIWebview页面行为的逻辑失效或异常:(可根据业务自身逻辑,实现测试页面后分别在Safari和微信WKWebview中验证)

    一:Safari或微信WKWebview中 页面A跳转到页面B再返回页面A后不会重新执行Script和Ajax(也不会触发页面reload)。 

    二:Safari或微信WKWebview中,在页面弹出输入键盘后,会触发JQuery的resize事件,而在UIWebView下不会。 

    三:Safari或微信WKWebview中, window unload 事件在只有刷新才能触发,退出页面或者跳转到其他页面都无法触发。 

    四:Safari或微信WKWebview中,极少数情况下某些特殊实现的页面点击事件会失效。

    如果有涉及或者遇到以上问题,以兼容Safari行为为准。

    展开全文
  • ajax请求的时候延迟500毫秒加载,setTimeout(function(){},500) cache:flase;

    ajax请求的时候延迟500毫秒加载,setTimeout(function(){},500) 
    cache:flase;

    展开全文
  • 目前用的动态修改页面title的方法如下:function editTitle(title) {var $body = $('body');document.title = title; // hack在微信等webview中无法修改document.title的情况var $iframe = $('').on('load', ...

    目前用的动态修改页面title的方法如下:

    function editTitle(title) {

    var $body = $('body');

    document.title = title;    // hack在微信等webview中无法修改document.title的情况

    var $iframe = $('').on('load', function () {

    setTimeout(function () {

    $iframe.off('load').remove()

    }, 0);

    }).appendTo($body);

    }

    微信iOS客户端将升级为WKWebview内核后,页面加载完之前通过(function(){

    editTitle("管人不要");

    })();

    可以修改成功,但在页面加载完成后调用该方法加载就失效了,比如通过input-button的click事件调用该方法;同时在Safari中测试又可以完成修改。

    从而感觉是微信内核自身的问题,但由于不清楚原理不知该如何从代码上解决。。

    展开全文
  • WKWebView: Differences from UIWebView browsing engine 优点 多进程,在app的主进程之外执行 使用更快的Nitro JavaScript引擎 异步执行处理JavaScript 消除某些触摸延迟 支持服务端的身份校验 支持对错误...

    翻译文,原文地址

    WKWebView: Differences from UIWebView browsing engine

    优点

    多进程,在app的主进程之外执行

    使用更快的Nitro JavaScript引擎

    异步执行处理JavaScript

    消除某些触摸延迟

    支持服务端的身份校验

    支持对错误的自签名安全证书和证书进行身份验证

    •  

    问题

    需要iOS9或更高版本(WKWebView在iOS8引入,但是很多功能,支持比较全面在iOS9以后的版本)

    不支持通过AJAX请求本地存储的文件

    不支持"Accept Cookies"的设置

    不支持"Advanced Cache Settings"(高级缓存设置)

    App退出会清除HTML5的本地存储的数据

    不支持记录WebKit的请求

    不能进行截屏操作

    优点(Advantages)

    多进程,在app的主进程之外执行

    WKWebView为多进程组件,也意味着会从App内存中分离内存到单独的进程(Network Process and Rendring Process)中。当内存超过了系统分配给WKWebView的内存时候,会导致WKWebView浏览器崩溃白屏,但是App不会Crash。(app会收到系统通知,并且尝试去重新加载页面)

    相反的,UIWebView是和app同一个进程,UIWebView加载页面占用的内存被计算为app内存占用的一部分,当app超过了系统分配的内存,则会被操作系统crash。在整个过程中,会经常收到iOS系统的通知用来防止app被系统kill,但是在某些时候,这些通知不够及时,或者根本没有返回通知。

    使用更快的Nitro JavaScript引擎

    WKWebView使用和手机Safari浏览器一样的Nitro JavaScript引擎,相比于UIWebView的JavaScript引擎有了非常重要的性能提升

    异步执行处理JavaScript

    WKWebView是异步处理app原生代码与JavaScript之间的通信,因此普遍上执行速度会更快。

    在实践操作过程中,JavaScript API调用原生(native)中方法不会阻塞线程,等待回调函数的执行。(在JavaScript代码会继续向下执行,而回调函数会由native端异步去回调)。举一个例子,之前一个"Save Data"的操作如下:

    // JavaScript code - 笔者注
    // 注释 - 笔者注
    
    var filenameID;
    function getFilenameID() {
        // 向native端发起请求,获取kioskId,结果返回由callback方式返回 
        window.kp_requestKioskId("kp_requestKioskId_callback");
    }
    // callback回调函数 - 由native端发起 
    function kp_requestKioskId_callback(kioskId) {
        filenameID = kioskId.split(" ").join("");
    }
    // kp_FileAPI_writeToFile方法不会等待kp_requestKioskId_callback回调函数执行,此时filenameID为undefined
    function saveData(fileName, data) {
        getFilenameID();
        kp_FileAPI_writeToFile(filenameID + ".xls", data, "writeFile_callback");
    }
    

    原先的假定是在'saveData'方法被触发时,在'kp_FileAPI_writeToFile'方法调用前,'getFilenameID'方法会返回filenameID

    但是,在WKWebView中JavaScript和native代码之间的通信是异步的,'kp_FileAPI_writeToFile'方法被调用之前,'getFilenameID'方法还没有完成(回调还没有被执行-笔者注),导致的结果是在'kp_FileAPI_writeToFile'中filename为undefined。为了正确的得到filename,必须重构之前的代码,在callback中完成。如下:

    var filenameID;
    function getFilenameID() {
        window.kp_requestKioskId("kp_requestKioskId_callback");
    }
    function kp_requestKioskId_callback(kioskId) {
        filenameID = kioskId.split(" ").join("");
        kp_FileAPI_writeToFile(filenameID + ".xls", data, "writeFile_callback");
    }
    function saveData(fileName, data) {
        getFilenameID();
    }
    

    消除触摸延迟

    UIWebView和WKWebView浏览器组件会将触摸事件解释后发送给app,因此,我们无法提高触摸事件的灵敏度或速度。

    在UIWebView上的任何触摸事件会被延迟300ms,用以判断用户是单击还是双击。这个机制也是那些基于HTML的web app一直不被用户接受的重要原因。

    在WKWebView中,测试显示,只有在点击很快(<~125ms)的时候才会添加300ms的延迟,iOS将其解释为更可能是双击“点击缩放”手势的一部分,而不是慢点击(>〜125 ms)后。更多细节在这里

    为了消除所有触摸事件(包括快速点击)的触摸延迟,您可以添加FastClick或另一个消除此延迟的库到您的内容中。

    支持服务端的身份校验

    与不支持服务器认证校验的UIWebView不同,WKWebView支持服务端校验。实际上,这意味着在使用WKWebView时,可以输入密码保护网站。

    支持对错误的自签名安全证书和证书进行身份验证

    通过“继续”/“取消”弹出窗口,WKWebView允许您绕过安全证书中的错误(例如,使用自签名证书或过期证书时)。

    问题

    需要iOS9或更高版本

    我们的WKWebView集成仅适用于运行iOS 9或更高版本的设备。虽然WKWebView是在iOS 8中引入的,但在这些版本中存在重大限制,包括无法访问本地存储的文件,我们无法解决此问题,因此此功能不兼容。

    不支持AJAX请求到本地存储的文件

    WKWebView不允许XHR请求file:// URI,因为这些URI违反了浏览器引擎的跨源资源共享规则。使用这种类型的请求的项目应该远程托管在服务器上,或使用现有的UIWebView浏览引擎。

    不支持"Accept Cookies"的设置

    虽然WKWebView确实支持使用cookies,但并没有公开选择哪些cookies被源代码接受的能力。这意味着在使用WKWebView浏览引擎时不会应用“接受Cookie”设置。

    WKWebView只允许我们访问cookie的名称,而不是附加信息,如创建/过期日期或路径,这使得更难以解决Cookie出现的问题。

    不支持"Advanced Cache Settings"(高级缓存设置)

    使用WKWebView浏览引擎时,不会应用“缓存源”和“仅通知服务器重定向事件的浏览器”。

    App退出会清除HTML5的本地存储的数据

    当应用退出并重新启动时,HTML5本地存储将被清除。

    不支持记录WebKit的请求

    WKWebView发出请求并呈现内容,无法直接访问此类请求,并且无法记录这些请求。

    不能进行截屏操作

    尽管我们在测试中没有看到使用Kiosk Pro的JavaScript API进行屏幕捕获的任何问题,但其他iOS开发人员报告说屏幕捕获在WKWebView上随机失败。如果截屏的API是app中的关键操作,建议使用现有的UIWebView浏览引擎。

    展开全文
  • wkwebview的适配问题

    2019-09-12 16:15:45
    1、微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配; 2、iOS微信6.5.3版本开始支持开发者手动切换WKWebview和UIWebview,使开发者可提前对WKWebview进行...
  • 微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配。如有问题,可参考文末联系方式,向我们咨询。 背景 WKWebView 是苹果在iOS 8中引入的新组件,目的是提供...
  • 微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配。 背景 WKWebView 是苹果在iOS 8中引入的新组件,目的是提供一个现代的支持最新Webkit功能的网页浏览控件...
  • 微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配。如有问题,可参考文末联系方式,向我们咨询。 背景 WKWebView 是苹果在iOS 8中引入的新组件,目的是提供一...
  • //解决微信内核wkwebview时返回上一页,界面不刷新的问题 window.onpageshow = function(event){ if (event.persisted) { window.location.reload(); } }; 作者:荼荼小蘼链接:...
  • WKWebView 简介WKWebView

    2016-07-06 11:26:00
    苹果将 UIWebViewDelegate 与 UIWebView 重构成了 14 个类和 3 个协议,引入了不少新的功能和接口,这可以在一定程度上看做苹果对其封锁 Web View 内核的行为作出的补偿:既然你们都说 UIWebView 太渣,那我就造一个...
  • WKWebView概述

    千次阅读 2017-02-10 12:06:27
    2.WebKit使用WKWebView来代替IOS的UIWebView和OSX的NSWebView,并且使用Nitro JavaScript引擎,这意味着所有第三方浏览器运行JavaScript将会跟safari一样快。3.内存问题:(1)UIWebView类的内存问题一直广受诟病,...
  • 一般的同样的html代码,在UIWebView和WKWebView中显示效果是不一样的。例如test_input显示效果:可以看出两者有明显的区别。那么如何适配呢?有两个方法(本质上是一个)。1、如果是H5适配WKWebView的话,需要在H5添加...
  • vue WKWebView 交互

    2020-07-09 21:06:40
    写在开始 目前AppStore提交已经彻底废弃UIWebView 以前一键接入的webjavascriptbridge也该放弃了 重新整理一下网页与原生的...@property(nonatomic,strong) WKWebView *webView; @end -(WKWebView *)webView{ if (!
  • iOS wkwebview 加载html

    千次阅读 2018-06-01 10:50:23
    wkwebview的优势1.交互更方便2.更低的内存占用3.高达60fps的滚动刷新率以及内置手势4.支持更多的HTML5特性5.基于webkit,支持Nitro JavaScript引擎6.提供常用的属性,如加载网页进度的属性...
  • WKWebView对Cookie的处理

    千次阅读 2020-07-13 16:15:06
    因为WKWebView是通过WebKit内核进行网络处理的,所以我们的NSHTTPCookieStorage里的Cookie是没办法拿到并带进一个请求的。可以通过下面的方法手动添加: NSMutableURLRequest *request = ...
  • 使用WKWebView替换UIWebView

    千次阅读 2016-07-13 11:16:51
    开发App的过程中,常常会遇到在App内部加载网页,通常用UIWebView加载。这个自iOS2开始使用的网页加载器一直是开发的心病:加载...iOS8以后,苹果推出了新框架Wekkit,提供了替换UIWebView的组件WKWebView。各种UIWe
  • IOS WKWebView 不支持 NSURLProtocol 吗

    千次阅读 2017-03-29 18:33:48
    IOS WKWebView 不支持 NSURLProtocol 吗
  • 一、整体介绍UIWebView自iOS2就有,WKWebView从iOS8才有,毫无疑问WKWebView将逐步取代笨重的UIWebView。通过简单的测试即可发现UIWebView占用过多内存,且内存峰值更是夸张。WKWebView网页加载速度也有提升,但是并...
  • 09、WKWebView的用法

    2021-09-02 20:02:29
    WKWebView的用法iOS如何调试Web代码2.1 iOS 模拟器调试web代码2.2 通过alert等相关方法2、获取WKWebView的准确高度2.1 通过注入JS代码2.2 通过KVO的方式3、WKWebView中Swift与JS交互3.1 基础知识3.1.1 ...
  • 之前写过一篇文章是关于基于NSURLProtocol做的DNS解析,其中对NSURLProtocol也有了简单的介绍,我们都知道他可以拦截所有基于URL Loading System 中的请求,但是对于WKWebview里面所发出的请求即使他是http/https 也...
  • 在 WebKit 源码的调试基础之上, 结合 iOS 端 WKWebView 的 WKNavigationDelegate 代理方法,站在移动端的视角深入分析 WKWebView 网络请求加载的生命周期流程。 WebKit 源码的调试,请参考我之前的博客:iOS之深入...
  • WKWebview相关知识点记录

    千次阅读 2017-02-06 14:36:47
    背景 WKWebView 是苹果在iOS 8中引入的新组件,目的是提供一个现代的支持最新Webkit功能的网页浏览控件,摆脱过去 ...也就是说WKWebview是针对IOS端的手机浏览器内核,本来这不关我们什么事儿的,但是问题在于微信i
  • iOS之深入解析WKWebView的cookie管理

    千次阅读 2021-07-24 02:25:56
    在浏览内核加载网络资源的过程中,往往离不开 HTTP 协议,它是在 Web 上进行数据交换的基础,同时也是一种无状态的 client-server 协议,这种无状态的属性促使许多端存储技术产生,其中最重要的技术之一就是 cookie ...
  • WKWebView与JS交互实战技巧之API介绍

    万次阅读 2016-04-30 12:38:28
    前言前一章我给大家介绍了iOS与...WKWebView 简介WKWebView 是苹果在 iOS 8 中引入的新组件,目的是给出一个新的高性能的 Web View 解决方案,摆脱过去 UIWebView 的老旧笨重特别是内存占用量巨大的问题。苹果将 UIWeb
  • WKWebview 的SSL异常

    千次阅读 2018-10-27 20:05:06
    webview的SSL异常是webview加载失败的重要原因之一,因此有必要对此进行较为全面的监控。我们的业务中关于...- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigat...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 762
精华内容 304
关键字:

wkwebview内核