精华内容
下载资源
问答
  • <div><p>ios wkwebview 内核会闪烁滑动也不是很跟手,这个能解决吗?</p><p>该提问来源于开源项目:mescroll/mescroll</p></div>
  • 自上次微信安卓升级至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;

    展开全文
  • wkwebview的适配问题

    2019-09-12 16:15:45
    1、微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配; 2、iOS微信6.5.3版本开始支持开发者手动切换WKWebview和UIWebview,使开发者可提前对WKWebview进行...

    1、微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配;

    2、iOS微信6.5.3版本开始支持开发者手动切换WKWebview和UIWebview,使开发者可提前对WKWebview进行适配。切换的方法在微信“添加朋友”中输入:switchweb,可进行WKWebview与UIWebview两者模式之间的转化

    3、校验切换方法:

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

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

    4、变量判断

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

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

    5、页面通过LocalID预览图片 

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

    适配建议:直接将JSSDK升级为1.2.0最新版本即可帮助页面自动适配,但在部分场景下可能无效,此时可以使用

    getLocalImgData 接口来直接获取数据。

    (注释:在wkwebview模式下会出现无法预览图片的现象,解决方法:首先将jweixin升级为1.2.0,若不能解决问题,则需要对getLocalImgData 进行适配调用),具体办法 

    主要对ios进行适配,localData是图片的base64数据

                            if (!mui.os.ios) {
                                     event.target.src = res.localIds[0];
                                // 支持低版本Android系统,延迟100ms执行上传
                                setTimeout(function() {
                                    vm.uploadImageToWechat(index);
                                }, 100);
                            }else{
                                if (window.__wxjs_is_wkwebview) {
                                    wx.getLocalImgData({
                                        localId: res.localIds[0], // 图片的localID
                                        success: function (res) {
                                            var localData = res.localData; // localData是图片的base64数据,可以用img标签显示
                                            event.target.src = localData;
                                        }
                                    });
                                } else {
                                    event.target.src = res.localIds[0];
                                }
                                vm.uploadImageToWechat(index);
                            }

    参考文献:https://mp.weixin.qq.com/wiki

    转载于:https://my.oschina.net/u/3366008/blog/877218

    展开全文
  • 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浏览引擎。

    展开全文
  • 微信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中引入的新组件,目的是提供一...
  • <div><p>原来的UIWebView可用,但是手动切换到WKWebview时无效。</p><p>该提问来源于开源项目:deboyblog/vue-wechat-title</p></div>
  • //解决微信内核wkwebview时返回上一页,界面不刷新的问题 window.onpageshow = function(event){ if (event.persisted) { window.location.reload(); } }; 作者:荼荼小蘼链接:...
  • WKWebView对Cookie的处理

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

    千次阅读 2017-02-06 14:36:47
    背景 WKWebView 是苹果在iOS 8中引入的新组件,目的是提供一个现代的支持最新Webkit功能的网页浏览控件,摆脱过去 ...也就是说WKWebview是针对IOS端的手机浏览器内核,本来这不关我们什么事儿的,但是问题在于微信i
  • 所以对于交互的方式,使用哪个内核,成为了我们需要进行抉择和研究的一部分。我们以前用的UIwebview来交互,本来这段时间一直在研究如何两套同时兼容,因为我们公司前端js封装了一个Android和iO...
  • WKWebView和UIWebView区别和其优缺点 大家都知道自从iOS8之后,推出了...WKWebView相比于UIWebView浏览器之间内核引擎的区别 JS调用OC 比如网页里有一个返回按钮,点击的时候需要pop到上一层。 OC @interf...
  • 【摘要】由于业务需要,与时俱进,UIwebView转WkwebView势在必行。但由于内核的更换,以前的支付方法也不再可行。所以,进行了一些折腾,希望通过这篇文章的叙述,让后人少走弯路,轻松迭代。【作者】x-teamer成员 ...
  • WKWebView 简介WKWebView 是苹果在 iOS 8 中引入的新组件,目的是给出一个新的高性能的 Web View 解决方案,摆脱过去 UIWebView 的老旧笨重特别是内存占用量巨大的问题。苹果将 UIWebViewDelegate 与 UIWebView 重...
  • 微信公众号开发笔记2

    2018-10-23 11:03:00
    现在ios微信客户端升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配。 Cookie和LocalStorage设置相关 一:退出微信账号后,将会清空所有Cookie和LocalStorage。 二:页面功能依赖Cookie,或有...
  • 原因IOS8引入了新组件WKWebView,而IOS的微信内核也已经在2017年3月1日升级为WKWebview内核,但是对于一些越狱的,或者比较老的iphone,或者旧版本的微信还是使用的是旧浏览器内核,Safari的内核.我的Safari的版本是5.1.4...
  • bug

    2017-03-06 11:56:00
    在使用bootstrap的v3.3.5版本,modal弹窗组件,在微信ios的wkwebview内核(2017-3-1起微信的ios版本都会更新为这个内核)情境下,页面会整体放大变形。 初步的兼容做法是设置bootstrap的类 .modal-open{ ...
  • 1、页面没有刷新,而是直接读取的缓存。...这个时候,肯定就很自然的联想到了可能是微信内核引起的,二微信此次换内核,更换成的是苹果的 WKWebview 内核。Safari很早之前就使用了这个内核,而且微信官方明确...
  • H5页面在IOS后退不刷新的解决方法

    千次阅读 2018-07-12 15:10:31
    页面上绑定在window上的事件莫名其妙的消失了(例如onscroll)这个时候,肯定就很自然的联想到了可能是微信内核引起的,二微信此次换内核,更换成的是苹果的 WKWebview 内核。Safari很早之前就使用了这个内核,而且...
  • 1.H5的localStorage第二次打开的时候不会清除,例如: ... localStorage.setItem("login","true"); 然后关闭微信,再重新进去,获取 ...2.苹果手机微信用的WKWebview内核,跨域请求接口的时候不会携带上cook...
  •  后来看到《微信iOS客户端将升级为WKWebview内核,请尽快适配》的信息,怀疑是升级带来的问题,按 iOS WKWebview 网页开发适配指南    切换方法 iOS微信6.5.3版本开始支持开发者手动切...
  • IOS8以上,WKWebview内核下, 应该需要严格签名url 去掉后面 # 号后面,否则会报错,config:invalid signature,在安卓下或UIWebview 都不会报错,微信分享朋友接口等接口出错,支付接口不会报错。  示例代码,URL...

空空如也

空空如也

1 2 3
收藏数 50
精华内容 20
关键字:

wkwebview内核