在 Angularjs 中利用浏览器缓存

Leverage browser caching in Angularjs

我正在从事一个 Angularjs 项目,我想实施利用图像的浏览器缓存来优化网站。有什么方法可以在 angularjs 项目中实现它。

利用浏览器缓存发生在 AngularJS 之外。您可以在您的服务器上创建一个 .htaccess 文件,可以在您的域的根目录中,也可以在与您的网络应用程序相同的目录中,其内容类似于:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

有关详细信息,请阅读此处:Varvy

浏览器缓存由服务器完成

除了 Linx8 答案,您还可以从 Google browser caching.

中找到更多相关信息

Cache-Control defines how, and for how long the individual response can be cached by the browser and other intermediate caches. To learn more, see caching with Cache-Control.

ETag provides a revalidation token that is automatically sent by the browser to check if the resource has changed since the last time it was requested. To learn more, see validating cached responses with ETags.

简而言之,浏览器响应带有以下标签的资源(图像、样式表、脚本):Cache-Control 和 Etags。这些 header 说明了它应该被缓存的方式和时间,或者它是否已经被修改过。当用户重新访问该站点时,他可以从缓存中获取它,而不是向 Web 服务器发出 HTTP GET 请求,从而节省时间和成本。建议的最短缓存时间为一周,最好长达一年(由 rfc2616 规定)。