禁用除 IE 之外的所有浏览器的 HTML5 AppCache答案

【问题标题】：Disable HTML5 AppCache Of All browser Except IE禁用除 IE 之外的所有浏览器的 HTML5 AppCache
【发布时间】：2020-07-26 00:55:16
【问题描述】：

我有一个基于 Angular 的 PWA 应用程序（基于 service-worker），它在所有现代浏览器中都可以离线工作，为了支持 IE，我添加了“manifest.appcache”，它使 IE 可以通过 HTML5 App Cache 离线工作。

有什么方法可以在除 IE 之外的所有其他浏览器中禁用 Appcache 吗？目前在现代浏览器中 Appcache 也与 service worker 一起工作

我在下面尝试过

<html lang="en" manifest="manifest.appcache" *ngIf="isIE">
<html lang="en" *ngIf="!isIE">

在组件中

const isIE = /msie\s|trident/i.test(window.navigator.userAgent);

但似乎 HTML 在组件设置值之前呈现 isIE

【问题讨论】：

标签： javascript angular internet-explorer progressive-web-apps html5-appcache

【解决方案1】：

我没有在 IE 上测试过，但是从这个 SO answer 看来，如果将 manifest 设置为客户端，它将无法工作。

在这种情况下，您可以使用 Angular Universal 设置此属性服务器端。

import {Request} from 'express';
import {REQUEST} from '@nguniversal/express-engine/tokens';

public constructor(@Inject(PLATFORM_ID) private platformId, 
            @Optional() @Inject(REQUEST) protected request: Request,
            @Inject(DOCUMENT) private  doc: Document, private renderer: Renderer2)
    {

        if(!isPlatformBrowser(platformId))
        {
          const isIE = /msie\s|trident/i.test(request.headers['user-agent']);
          if(isIE)
          {
            this.renderer.setAttribute(this.doc.documentElement,"manifest","manifest.appcache");
          }
        }

如果您没有使用 Angular Universal 并且不能/不想使用它，则需要在返回之前找到其他方法来修改 index.html 文件服务器端。

【讨论】：

【解决方案2】：

我尝试搜索但没有得到任何解决此问题的方法。

除了 IE 浏览器之外，我没有任何方法可以禁用其他浏览器的 AppCache。

即使你设法删除了 manifest 属性，浏览器也会使用 Appcache。

禁用它的唯一方法是从服务器中删除清单文件，这也将禁用 IE 浏览器的 Appcache。 See here.

我建议您在 IE 窗口中显示您的应用不支持 IE 浏览器的离线模式的消息，并建议您的客户使用最新的 Microsoft 浏览器。

【讨论】：

这不是解决方案
没有官方方法可以做这件事。动态添加清单可能需要刷新页面才能生效，这可能是用户不需要的行为，也可能导致性能问题。我会尝试寻找其他可能的方法，如果我得到任何有用的信息，我会通知你。感谢您的理解。