ZEIT Now Angular PWA handle 404

Question

我现在在ZEIT 上托管了一个PWA IONIC/Angular。我注意到有时在部署后，应用程序在启动时会出现空白页。经过研究，我发现部署后，浏览器想要获取一些缓存的.js文件。

通常，ZEIT Now 只会显示 404 或其他内容或提高 http 404 状态。但我注意到响应是浏览器无法处理的index.html(状态为 202(，因为它需要 javascript 而不是文本/html。

我目前的now.json

{
"version": 2,
"name": "my-app",
"routes": [
{
"src": "dist/main.*.js",
"headers": { "Cache-Control": "s-maxage=0, max-age=0" }
},
{
"src": "dist/ngsw.json",
"headers": { "Cache-Control": "s-maxage=0, max-age=0" }
}
] 
}

我该如何处理？

Answer 1

也许您可以尝试 404 个不存在的散列.js文件？以下是几个步骤：

1. 使用高级项目设置去掉dist前缀。
2. 如果要使用routes(参考(，请在修复"dist"前缀问题后尝试：

"routes": [
{ "handle": "filesystem"},
{
"src": "/main.*", "status": "404", "dest": "/404"
}
] 

Answer 2

自动检测 Angular，并添加通配符路由，以便任何与静态资产不匹配的路由都将服务于/index.html。

https://zeit.co/docs/v2/build-step#optimized-frameworks

听起来最好的解决方案是禁用文件哈希，这样您的 js/css 资产就不会每次都重命名。

ZEIT Now已经清除了CDN缓存，因此您无需担心过时的文件。

https://zeit.co/docs/v2/network/caching