WkWebview 被 Angular 冻结了

Posted 2023-02-19

技术标签:

【中文标题】WkWebview 被 Angular 冻结了【英文标题】：WkWebview is freezing with Angular 【发布时间】：2017-01-17 07:21:25 【问题描述】：

背景

我们有一个简单的 Angular+Bootstrap 应用程序，它在使用 WkWebview 嵌入我们页面的外部应用程序中运行。该应用程序在桌面所有操作系统、android 和 Iphone 中运行良好。没有 javascript 错误或 CSS 警告。

问题

但是，当我们点击<a href="#screen2" 时，它随机在 iPad 中停止运行。这会触发routerProvider 的更改，以更改屏幕控制器和模板。它的接缝就像一个透明层正在锁定整个屏幕。或者所有事件（点击标签滚动）都被锁定。

怪事

如果我们将方向更改为横向，屏幕将被解锁。如果我们再次转向纵向，它会再次锁定。

附加

我们无法将 WkWebview 更改为更新的。我们只能控制 webapp。我们知道 WkWebview 有几个相关的问题：滚动、焦点和显示更改会影响渲染并导致空白或冻结屏幕。我们还使用此脚本来避免某些焦点事件出现黑屏：

(function()
  try
      var a=navigator.userAgent;
      if((a.indexOf('Salesforce')!=-1)&&(a.indexOf('iPhone')!=-1||a.indexOf('iPad')!=-1)&&(a.indexOf('OS/8')!=-1||a.indexOf('OS 8')!=-1||a.indexOf('OS/9')!=-1||a.indexOf('OS 9')!=-1||a.indexOf('OS 10')!=-1||a.indexOf('OS/10')!=-1)&&(a.indexOf('Safari')==-1))
        var s=document.createElement('style'); 
        if(a.indexOf('OS/8')!=-1||a.indexOf('OS 8')!=-1) 
            s.innerhtml="html,html bodyoverflow: auto;-webkit-overflow-scrolling:touch;bodyposition:absolute;left:0;right:0;top:0;bottom:0;";
        
        else if(a.indexOf('OS/9')!=-1||a.indexOf('OS 9')!=-1) 
            s.innerHTML="html,html bodyoverflow: auto;-webkit-overflow-scrolling:auto;bodyposition:absolute;left:0;right:0;top:0;bottom:0;";
        
        else if(a.indexOf('OS/10')!=-1||a.indexOf('OS 10')!=-1) 
            s.innerHTML="html,html bodyoverflow: auto;-webkit-overflow-scrolling:auto;bodyposition:absolute;left:0;right:0;top:0;bottom:0;";
        
        document.getElementsByTagName('head')[0].appendChild(s);
      
   catch(e)
)();