JavaScriptにユニークなURLクエリを自動付与してキャッシュをクリアさせるショートコード

以下の記事ではJavaScriptのキャッシュをクリアする方法としてURLクエリを付与する方法を紹介しました。

.jsファイルのキャッシュを強制的に更新させる方法

.jsファイルを強制的に更新させる方法を紹介。

でもJavaScriptを更新する度に一々URLクエリを別のものにするのは少し面倒ですよね？

そんな方のために、WordPressにおいて、ユニークなURLクエリを自動付与するショートコードを追加する方法を紹介します。

=== 目次 ===

ユニークなURLクエリを自動付与するショートコード
まとめ

ユニークなURLクエリを自動付与するショートコード

WordPressにおいて、ユニークなURLクエリを自動付与するショートコードを追加する方法を紹介します。

注意点

この方法はPHPを使用します。コードエラーなどの場合にはブログが表示されなくなる可能性があります。この方法で発生したトラブルなどの損害は自己責任とします。トラブルを自己で解決できる方のみ使用してください。

準備

テーマエディターのfunction.phpに以下のPHPコードを追加します。

function InsertScriptWithUniqueId_JS_ShortCode_Callback($atts, $content) {
    $path = strstr($content, "\\");
    if($path == false) return "[InsertScriptWithUniqueId_JS ERROR] Not file path: " . $content;
    $path = substr($path, 1);

    $url = get_site_url() . "/" . str_replace("\\", "/", str_replace("public_html\\" ,"", $path)) . "?id=" . uniqid('', true); //filemtime($path);
    return '<script src="' . $url . '"></script>';

}
add_shortcode("InsertScriptWithUniqueId_JS", "InsertScriptWithUniqueId_JS_ShortCode_Callback");

使い方

以下のようにJavaScriptファイルのパスを指定してショートコードを使用します。

[InsertScriptWithUniqueId_JS]public_html/test.js[/InsertScriptWithUniqueId_JS]

すると、下記のように自動的にユニークなIDを付与したURLを持つscriptタグに変化します。

http://xxxx.co.jp/test.js?id=63f7271d5f3698.78837961

このURLクエリはユニークなものですので、これで確実にJavaScriptのキャッシュがクリアされます。

まとめ

この記事ではWordPressにおいて、JavaScriptにユニークなURLクエリを自動付与してキャッシュをクリアするショートコードを追加する方法を紹介しました。

自作JavaScriptなどを使用するブログを運営している場合に活用してみてはいかがでしょうか？