时间戳

首页 > 解决方案 > 禁用除 IE 之外的所有浏览器的 HTML5 AppCache

javascript - 禁用除 IE 之外的所有浏览器的 HTML5 AppCache

问题描述

我有一个基于 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

标签： javascriptangularinternet-explorerprogressive-web-appshtml5-appcache

解决方案

我没有在 IE 上测试过，但是从这个SO 答案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在返回之前找到其他方法来修改文件服务器端。

推荐阅读