我的浏览器会从数据URL缓存favicon

Question

我想使用以下base64 favicon和一些base64图像.

<link href="data:image/x-icon;base64,AAABAAEAEBAAAAAAAABoBQAAFgAAACgAAAAQAAAAIAAAAAEACAAAAAAAAAEAAAAAAAAAAAAAAAEAAAAAAA..AMAK3WxwAOWT0AK4RgAKHOvQA4hWUAP4lqAD2MagBQm3kATKSBAECcdP//AAD8/wAA+H8AAPA/AADwPwAA4B8AAMAPAACABwAAAgMAAI8BAADfgAAA/8AAAP/AAAD/4QAA//MAAP//AAA=" rel="icon" type="image/x-icon" />

这些会被我的浏览器缓存吗？

Answer 1

不会.数据URI不会单独缓存其包含的文档(例如CSS或HTML文件),因此每次重载时都会下载包含文档的数据.

资源

Answer 2

缓存您网站的图标实际上被推荐为加速您的网站的性能最佳实践。

例如，Google 不会浪费额外的宝贵字节在其主页的源代码中包含网站图标（使用<link />URI 或数据 URI）。

相反，他们使用设置在未来很远的 HTTP 标头来提供他们的网站图标。Cache-Control: private, max-age=31536000（31,536,000 秒 = 365 天）。

如果您有兴趣控制网站图标的“新鲜度”，您可以使用 Cache-Control 和 HTTP Headers — 例如，如果您计划更改网站图标或不希望它被缓存，您可以调整它因此。

使用Apache 和 mod_expires的示例：

<IfModule mod_expires.c>
    # Add Expires Header
    # http://www.askapache.com/?p=152

    ExpiresActive On
    ExpiresByType image/x-icon "access plus 1 month"
</IfModule>

此模块控制服务器响应中的 Expires HTTP 标头和 Cache-Control HTTP 标头的 max-age 指令的设置。到期日期可以设置为相对于上次修改源文件的时间或客户端访问的时间。