时间戳

首页 > 解决方案 > 带有附加版本号的 gzip .js 和 .css 文件

javascript - 带有附加版本号的 gzip .js 和 .css 文件

问题描述

我已将以下代码添加到我的.htaccess文件中，并且gzip适用于下面匹配的所有文件名。我遇到的唯一问题是任何附加了版本或内部版本号的文件都不会被压缩。

有谁知道我如何修改以下代码以使用附加的版本/构建信息？

.ht 访问代码

<IFModule mod_deflate.c>
<filesmatch "\.(js|css|html|jpg|png|php)$">
SetOutputFilter DEFLATE
</filesmatch>
</IFModule>

未压缩的 Revolution Slider JS 版本号示例

/wp-content/plugins/revslider/public/assets/js/jquery.themepunch.tools.min.js?ver=5.4.7.3

未压缩的 Cookie 通知 CSS 版本号示例

/wp-content/plugins/cookie-notice/css/front.min.css?ver=ff52705092b5c9e7ebd0f25314174bde

标签： javascriptcss.htaccessgzip

解决方案

这是一个杠杆浏览器缓存问题，要解决此问题，您需要将以下四行添加到您的.htaccess:

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/json "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
</IfModule>

这将缓存其中包含的所有文件js?ver=。如果您正在寻找一个完整的工作杠杆浏览器缓存，您可以使用：

## 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 application/x-javascript "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/json "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

改进您的 GZIP 代码：

## GZIP COMPRESSION ##
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf

这将涵盖所有内容。确保在测试之前清除缓存。

推荐阅读