TL; DR：我想弄清楚的是如何配置我的AppCache清单，以便仅存储根URL以及任何明确提到的静态文件，并使用所述根网站作为任何其他URL的后备，以便我可以使用我的基于SPA JS的路由方法。
我有一个使用react-router and browserHistory创建干净网址的SPA，就好像它们都是单独的网站一样。
实现这项工作的目标是，当我们点击刷新时，网络服务器必须提供相同的index.html网站（然后使用JavaScript来读取网址并执行操作）。好的，这很容易。
现在我正在尝试使用AppCache使SPA工作脱机（因为我必须支持Safari）。该应用有点类似于Google地图允许您与网址共享位置的方式：它允许用户通过简单的链接/dataset/<dataset name>/<parameters>将视图分享到具有特定视图设置的数据集。所以我基本上希望它可以从主网址离线工作，也可以像这样任何可能的路径。
经过大量的试验和错误（以及Firefox's tools to debug the manifest）后，我得到了这个：
CACHE MANIFEST
# dfb55f7a1c2f0ab09a93
/static/js/bundle.dfb55f7a1c2f0ab09a93.js
CACHE:
/
static/css/bundle.min.css
NETWORK:
*
FALLBACK:
/dataset/ /index.html
这使我可以根据需要在离线¹时刷新和查看数据集URL！但是现在浏览器不仅缓存根/，还缓存任何/dataset/<foo>/<bar>。如果我的用户开始传递网址，他们将开始缓存每个网址。这也不是我想要的，因为这是浪费资源，并在更新应用程序时产生更多复杂性。
所以我遇到的问题是如何配置我的AppCache清单，以便仅存储根URL以及任何明确提到的静态文件，同时仍然允许我使用所述根网站作为后备任何其他网址，以便我可以在离线时点击刷新。
¹好吧，假设数据集被访问过之前的缓存;为此，我们使用localForage库。就我所见，这一切都很好，并没有与AppCache重叠。
答案 0 :(得分：0)
好的，这个网页上解释的解决方案对我有用：
http://dev.topheman.com/automate-appcache-offline-support-in-your-webpack-build/
这里解释的关键是：
FALLBACK:
. offline.html
具体来说，每个其他网站（包括the page on the normally-excellent MDN）都会以此为例：
FALLBACK:
/ offline.html
这会使清单无效（可以在Firefox中使用SHIFT + F2，appcache validate进行测试）。如MDN页面的 text 部分所述：
FALLBACK：FALLBACK：部分指定浏览器的后备页面 如果资源不可访问，应该使用本节中的每个条目 列出两个URI - 第一个是资源，第二个是后备。 两个URI必须是相对的，并且与清单的原点相同 文件。可以使用通配符。
Chrome并不关心，但Firefox确实如此。