首页 > 解决方案 > Angular 8 和 Service Worker 哈希不匹配

问题描述

我有一个 Angular 8 应用程序部署到启用/注册了服务工作者的服务器。我们似乎遇到的问题是站点随机加载旧版本而不是站点的最新版本。我认为这是因为服务人员,所以当我转到 /ngsw/state 时,我在调试时收到以下错误:

NGSW 调试信息:

Driver state: EXISTING_CLIENTS_ONLY (Degraded due to failed initialization: Hash mismatch (cacheBustedFetchFromNetwork): https://mysite/index.html: expected 3103c76d8444cfb504f58967dfb578826e29a778, got f5405776b6b8852db45bf2e118999dffc33ddaea (after cache busting) Error: Hash mismatch (cacheBustedFetchFromNetwork): https://mysite/index.html: expected 3103c76d8444cfb504f58967dfb578826e29a778, got f5405776b6b8852db45bf2e118999dffc33ddaea (after cache busting) at PrefetchAssetGroup.<anonymous> (https://mysite/ngsw-worker.js:699:35) at Generator.next (<anonymous>)at fulfilled (https://mysite/ngsw-worker.js:320:62)) Latest manifest hash: f2dce0f16ab8d88dc3d3701ffabc1475507649be Last update check: 1m52s425u

=== Version f2dce0f16ab8d88dc3d3701ffabc1475507649be ===

Clients: 0fc1bc95-193d-4a3a-9953-6df0bccc7b6c

=== Idle Task Queue ===
Last update tick: 1m52s327u
Last update run: 1m47s326u
Task queue:

Debug log:

[1m59s831u] TypeError(Failed to fetch, TypeError: Failed to fetch) Driver.fetch(https://connect.facebook.net/en_US/fbevents.js) [1m59s147u] TypeError(Failed to fetch, TypeError: Failed to fetch) Driver.fetch(https://stats.g.doubleclick.net/j/collect?t=dc&aip=1&_r=3&v=1&_v=j89&tid=UA-151661671-2&cid=1149317656.1606203988&jid=704609344&gjid=982880217&_gid=688801729.1617694502&_u=QACAAEAAAAAAAC~&z=1082920103) [1m52s575u] Error(Hash mismatch (cacheBustedFetchFromNetwork): https://mysite/index.html: expected 3103c76d8444cfb504f58967dfb578826e29a778, got eee6f2cd04ab4f02dbfdaa3e424007927721b6cb (after cache busting), Error: Hash mismatch (cacheBustedFetchFromNetwork): https://mysite/index.html: expected 3103c76d8444cfb504f58967dfb578826e29a778, got eee6f2cd04ab4f02dbfdaa3e424007927721b6cb (after cache busting) at PrefetchAssetGroup.<anonymous> (https://mysite/ngsw-worker.js:699:35) at Generator.next (<anonymous>) at fulfilled (https://mysite/ngsw-worker.js:320:62)) Error occurred while updating to manifest d5b4ea310e6ff5fbb7a547834e701efb6d6dcbf7 [1m52s327u] Error(Hash mismatch (cacheBustedFetchFromNetwork): https://mysite/index.html: expected 3103c76d8444cfb504f58967dfb578826e29a778, got f5405776b6b8852db45bf2e118999dffc33ddaea (after cache busting), Error: Hash mismatch (cacheBustedFetchFromNetwork): https://mysite/index.html: expected 3103c76d8444cfb504f58967dfb578826e29a778, got f5405776b6b8852db45bf2e118999dffc33ddaea (after cache busting) at PrefetchAssetGroup.<anonymous> (https://mysite/ngsw-worker.js:699:35) at Generator.next (<anonymous>) at fulfilled (https://mysite/ngsw-worker.js:320:62)) Error occurred while updating to manifest d5b4ea310e6ff5fbb7a547834e701efb6d6dcbf7 [1m52s327u] TypeError(Failed to fetch, TypeError: Failed to fetch) Driver.fetch(https://mysite/) [1m47s325u] TypeError(Failed to fetch, TypeError: Failed to fetch) Driver.fetch(https://mysite/ngsw.json?ngsw-cache-bust=0.564237218729041) [1m47s325u] Check for update aborted. (Client or server offline.)

当我检查服务器上的 index.html 文件时,我发现 ng build 之后构建的内容没有区别(部署后添加的额外行或任何其他更改)。我还从服务器检查了文件的哈希值,它显示了正确的哈希值:3103c76d8444cfb504f58967dfb578826e29a778,所以我不确定它是如何获得完全不同的哈希值的。

我能看到的唯一区别是,当我在站点上并进入开发人员工具时,所提供的 index.html 文件有几行额外的行(我认为它来自我们的监控 js 代理)然后服务器上的内容本身。不确定这是否是原因?

任何关于哪里/什么可能导致这种情况的指导将不胜感激

标签: angularprogressive-web-appsangular-service-worker

解决方案


推荐阅读