HTML5,appcache 究竟是如何工作的?

HTML5, how exactly does appcache work?

所以我有一个文件服务器正在监听我的 IP。

我创建了一个 test.html、test.js 和一个 manifest.appcache。 我的应用缓存说:

CACHE MANIFEST
CACHE:
test.html
test.js

NETWORK :
*

与此同时,我的 test.html :

<html manifest="manifest.appcache">

如果我访问 test.html,一切正常,但是如果我想更改 html 文件中的某些内容并重新加载页面,则没有任何改变(旧的 html文件已缓存)。

如果我更改我的应用程序缓存文件中的某些内容,例如只需编辑变量后面的 space 并重新加载我的页面,它会接受来自我的 html 文件的所有更改并且不会忽略这些更改没有了。

这是为什么? 我怎样才能让它在我每次重新加载页面时都听我的 html 文件?

这就是缓存的工作原理。如果你想像你已经说过的那样刷新缓存,你需要更改你的清单文件。

You must modify the manifest file itself to inform the browser to refresh cached files.

但是可以用JS查看缓存是否有变化

你可以这样获取缓存对象:window.applicationCache

window.addEventListener('load', function(e) {
  // Add an event listener to the cache
  window.applicationCache
        .addEventListener('updateready', function(e) {
    // Check if ready to update (The update ready status is 4)
    if (
         window.applicationCache.status ==
         window.applicationCache.UPDATEREADY) {
        // Get new app chache
        // window.location.reload();
        window.applicationCache.swapCache()
    }
  }, false);
}, false);

在这里查看官方文档:https://html.spec.whatwg.org/#applicationcache

请注意此功能已弃用,您不应使用它

来自MDN

This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Avoid using it and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

我该怎么办?

您应该使用新的 Service Worker API,它是应用程序缓存的直接替代品。 Service Worker 拥有 App Cache 的所有功能,甚至更多。

对于 Service Worker API 检查这些: