[WordPress] 外掛分享： Filename based asset cache busting

WordPress 外掛 Filename based asset cache busting 的封面圖片。

前言介紹

  • 這款 WordPress 外掛「Filename based asset cache busting」是 2016-03-23 上架。
  • 目前有 200 個安裝啟用數。
  • 上一次更新是 2020-04-27，距離現在已有 1832 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
  • 外掛最低要求 WordPress 3.0.1 以上版本才可以安裝。
  • 有 5 人給過評分。
  • 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。

外掛協作開發者

ocean90 | benlumley |

外掛標籤

JS | css | asset | assets | version |

內容簡介

這是一個基於檔案名稱的快取清除外掛程式，使用最後修改日期來管理 WordPress scripts/styles。

不要再讓客戶或使用者硬重整或者按下 shift + 重整了。只要檔案有修改，你網站上所有 css/js 檔案的 URL 就會自動更改。你可以設定適當的長期快取存活時間，以協助你在 Google Pagespeed 上獲得最高分數，同時避免快取後的 css/javascript 問題。

基於 Dominik Schilling 的這項 gist https://gist.github.com/ocean90/1966227 ，我對它進行了增強，即可自動以檔案修改時間來替換資產版號，並自動編輯 htaccess - 安裝和忘記。

如果有更多情況，也可以選擇使用查詢字串選項作為後備。

Web 伺服器
Apache

這個外掛會自動把所需的添加到你的 .htaccess 檔案，就像 WordPress 本身一樣。但如果由於任何原因它無法運作，以下是它添加的內容:

# FBACB

RewriteEngine On
RewriteBase /

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.+)\.([0-9\.]+)\.(js|css)$ $1.$3 [L]

# still fbacb

ExpiresActive on
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"

# END FBACB

NGINX
location ~* ^(.+)\.(?:\d+)\.(min.js|min.css|js|css)($|\?.*$) {
try_files $uri $1.$2;
}

特定主機注意事項

某些網站主機可能需要進行一些客製化設定，才能使基於檔案名稱的 URL 運作正常。

WP Engine

要在 WP-Engine 上運行，您需要透過 my.wpengine -> installname -> 重新導向規則，新增以下導向:

Source: ^(.+)\.([0-9\.]+)\.(js|css)$
Dest: $1.$3
Type: break (this is under advanced)

CloudWays

可以直接使用。

Flywheel

也可以直接使用。

PHP Fallback

如果您的網頁伺服器無法使用 URL 重新導向提供資產，該外掛程式會嘗試使用 PHP 程式來提供它們（例如：透過 PHP 本身）。顯然，這樣在實際生產情況下會很慢/不理想（速度會慢很多），因此您應該將伺服器設定為適當地提供檔案。如果在您的資產中看到此 HTTP 標頭“FBACB-Php-Fallback：yes”，這樣的情況就適用於您。

請注意，網站主機越來越多地被設定為從磁碟直接提供 css/js，並且不會回到 PHP + WordPress 錯誤處理 – 因此此後備將無法運作。

原文外掛簡介

Filename based cache busting for WordPress scripts/styles using last modified date.
Stop telling clients or users to hard refresh / shift refresh. The url to all of the css/js files on your site will change automatically whenever the files are modified. You can set proper long cache lifetimes to help get top scores on Google Pagespeed without running into cached css/javascript problems.
Based on this gist https://gist.github.com/ocean90/1966227 from Dominik Schilling, I’ve enhanced it by automatically replacing the asset version with the files modification time and automatically editing htaccess – making it install + forget.
Includes querystring option as a fallback – which works in more scenarios.
Webservers
Apache
The plugin should add what it needs to your .htaccess file jsut like WP itself. But if for any reason that doesn’t work for you – here’s what it adds:
# FBACB

RewriteEngine On
RewriteBase /

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.+)\.([0-9\.]+)\.(js|css)$ $1.$3 [L]

# still fbacb

ExpiresActive on
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"

# END FBACB

NGINX
location ~* ^(.+)\.(?:\d+)\.(min.js|min.css|js|css)($|\?.*$) {
try_files $uri $1.$2;
}

Host specific notes
Some webhosts need a bit of custom config to get the filename based urls working.
WP Engine
To work on WP-Engine, you’ll need the following redirect added via my.wpengine -> installname -> Redirect rules
Source: ^(.+)\.([0-9\.]+)\.(js|css)$
Dest: $1.$3
Type: break (this is under advanced)

CloudWays
Just works.
Flywheel
Just works.
PHP Fallback
If your webserver is failing to serve assets using url rewriting, the plugin attempts to serve them itsef (ie: via PHP). Obviously this is slow/less than ideal in production (it’ll be much slower) – so you should configure your web server correctly to serve the files. If you see this HTTP header “FBACB-Php-Fallback: yes” on your assets, this applies to you.
Note that hosts are increasingly configured to serve css/js directly from disk and won’t fall back to PHP + WordPress error handling – this fallback then won’t work.

各版本下載點

  • 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
  • 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「Filename based asset cache busting」來進行安裝。

（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。

1.1 |

延伸相關外掛（你可能也想知道）

  • Prevent Browser Caching 》您是一位前端開發人員嗎？想要清除所有使用者的瀏覽器快取嗎？只需啟用此外掛程式並展現您的作品！, Prevent Browser Caching 外掛程式可讓您自動或手動一鍵...。
  • Publitio 》Publitio 提供功能強大的 REST 及 URL-Based API 以用於雲端媒體資產管理。我們認為開發應該是一種有趣創意的體驗，才能真正感到滿足。Publitio 試圖藉由簡化...。
  • Custom Upload Folder 》在 WordPress 媒體庫中上傳檔案到自訂目錄。。
  • Disable Version Caching – Khanakia 》你是一位前端開發者嗎？你想為所有使用者清除瀏覽器快取嗎？只需啟用這個外掛就可以！, Disable Version Caching 可以自動或手動一鍵更新所有 CSS 和 JS 檔案...。
  • Assets to footer 》將腳本和樣式移至頁腳，以減少頁面加載時間。您可以排除特定的樣式和腳本，不將其移至頁腳。。
  • Assets Manager 》Assets Manager是一個自架檔案分享工具。由於許多現有的檔案分享服務都被高安全防火牆封鎖，因此開發了Assets Manager以滿足檔案分享的需求。當您上傳一個檔...。
  • AssetsMinify 》是否曾經希望以清晰的方式縮小 WordPress 網站的所有樣式表和腳本呢？, AssetsMinify 能夠使用 wp_enqueue_style() 和 wp_enqueue_script() 包含所有的 CSS ...。
  • Dynamic Asset Versioning 》WordPress 資源版本控制有時候會是一把雙刃劍：一方面它能夠極有效地進行緩存破解，確保你不會向瀏覽者分享過時的腳本或樣式。另一方面，手動增加版本號碼是...。
  • Resources WP 》總結:, ResourcesWP 提供了彈性功能，可添加多種資源類型，包括部落格、可下載文件、獨立頁面等等。管理資產從未如此輕鬆。我們的 WordPress 外掛提供了靈活...。
  • IntelligenceBank Connector 》IntelligenceBank 連接器 (Connector) for WordPress 讓使用者可以直接從 WordPress 媒體管理介面連接到他們的 IntelligenceBank 數位資產管理平台內容。點擊...。
  • TypePad to WordPress assets importer 》TypePad to WordPress可以解析所有內容，尋找圖像，並將這些圖像複製到您的新WordPress安裝中，並更新您的內容以引用帖子或頁面中圖像的新URL。。
  • Polylang assets URLs fix 》安裝這個外掛，可以讓 URL 正確運作 - 不需要任何配置。, 這個外掛可以解決以下問題：, , CSS, JS, 字體（也包括 Google 字體）, , 此外，這個外掛還可以消除...。
  • Site Assets 》Site Assets 是一個工具，可輕易地在每個網頁上分享網站資源，對於有多位貢獻者和開發人員的網站非常有幫助。, , 設置權限，決定誰可以新增或檢視資源, 以每...。
  • Phraseanet WordPress Client 》這個外掛可以讓你從 Phraseanet 伺服器中獲取和新增資產至你的 WordPress 網站中。, 此外掛允許你創建一個具有各種自定義配置的 Phraseanet Gutenberg 區塊，...。
  • Minify 》與我們在 eMusic 上使用的類似-這個軟體仍在實驗階段，不過可以先看看！, 自動串接 wp_head() 和 wp_footer() 中輸出的 JS 和 CSS 檔案-從 Memcached (如果已...。

文章
Filter
Mastodon