SDK 升级后 Flutter Web 中的图标错误

Posted 2023-02-23

【中文标题】SDK 升级后 Flutter Web 中的图标错误

【英文标题】：Wrong icons in Flutter Web after SDK upgrade

【发布时间】：2021-08-21 17:07:00

【问题描述】：

在 SDK 升级后重建我的 Flutter Web 应用程序时，访问过该应用程序以前版本的浏览器现在显示错误的图标。清除这些浏览器中的浏览数据时问题消失了（但这显然不是所有访问者的解决方案）。

我的假设是main.dart.js 已使用服务器的最新版本正确刷新，但MaterialIcons-Regular.otf 仍从浏览器磁盘缓存中加载。

这个解释有意义吗？

有什么办法可以避免这个问题吗？

使用示例应用重现问题的步骤：

使用 Flutter 2.0.0 创建和构建 Flutter Web 应用，并将其部署在 Web 服务器上 使用浏览器访问应用程序 使用 Flutter 2.2.1 重新构建应用并进行部署 在浏览器中刷新应用

【参考方案1】：

当 service worker 尝试刷新图标文件时，浏览器从磁盘缓存中获取它，而不是请求服务器。为了避免这种情况，我修改了 Web 服务器的配置，在响应中添加“无缓存”标头，并在服务工作者请求时强制浏览器从服务器获取文件。

在我添加的 Apache Virtualhost 的配置中：

    Header set Cache-Control "no-cache, no-store, must-revalidate"
    Header set Pragma "no-cache"
    Header set Expires 0