MTAppjQuery:user.cssの変更をすぐ反映させるようにする

はじめに

※本記事の内容は、MTAppjQueryの基本的な使い方が分かっている事を前提に書かれています。

MTAppjQueryは、user.cssに書き込んだスタイルを管理画面に適用できますが、閲覧者が開いた際に、ブラウザのキャッシュが効いて更新が即時反映されない場合があります。

そこで、今回は「ダミークエリ」を用いて、MTAppjQueryのuser.cssの変更を即時反映できるようにします。

ダミークエリとは

まず、クエリについて簡単に説明します。
クエリとは、cgiなどのウェブアプリケーションにパラメータを渡す際に使われる手法の一つです。
具体的には、URLの末尾に、[変数名]=[値] と言うような値の組み合わせを付加します。
MT管理画面のURLを見ると分かりやすいかと思います。

https://www.example.com/mt/mt.cgi?__mode=list&_type=page&blog_id=3&filter_key=my_posts_on_this_context

では、ダミークエリは通常のクエリと何処が違うかと言うと、
次のような形で、本来不要なクエリをURLに付加している事です。

http://www.example.com/index.html?12345678

ダミークエリの値が変更されると、ブラウザはまだ読み込んでないファイルと認識する為か、キャッシュを用いず、ファイルの内容を参照します。
今回はこの特性を利用して、即時反映の為の実装を行います。

MTAppjQueryのuser.css へのダミークエリの設定

ussr.css 周りのMTAppjQueryの仕様

MTAppjQueryでは、管理画面のソースに、user.cssを読み込む為のlinkタグを挿入します。
このとき、ウェブサイト/ブログ個別のuser.cssを適用しているウェブサイト/ブログの管理画面の場合、user.css はウェブサイト/ブログ個別のもののみが読み込まれ、更にそのuser.cssのアドレスにはダミークエリが自動で付加されます。

しかし、ウェブサイト/ブログ個別のuser.cssを適用してない場合、デフォルトの/mt-static/plugins/MTAppjQuery/user-files/user.css が読み込まれ、それにはダミークエリが付きません。

なので、今回ダミークエリを自動付加する実装が必要なのは、デフォルトのuser.css に対して、となります。

実装

実装で変更するのは、Perlのコード一カ所のみであり、シンプルな変更となります。

MTAppjQueryのCallbacks.pm の296行目あたりに、管理画面に挿入される、css読み込み用のhtmlコードを生成する箇所があります。

    my $user_css = ($op_usercss == 1) ? qq(<link rel="stylesheet" href="$user_css_url" type="text/css" />): '';

次のように変更します。

    my $user_css = ($op_usercss == 1) ? qq(<link rel="stylesheet" href="$user_css_url?<mt:date format="%Y%m%d%H%M"/>" type="text/css" />): '';

変更の内容としては、url文字列の格納された変数$user_css_urlの後に、mt:Dateタグをダミークエリを挿入しています。
これにより、読み込む度に違う値が適用されるので、常に最新のuser.css を読み込めるようになります。

あとがき

細かい検証はしてませんが、自分の扱う環境では今のところ問題無く動作しています。
(まあ、そんな手の込んだ変更ではないので、不具合は起きないとは思いますが、、)

また、プラグインのコードをのぞいたところ、デフォルトのuser.js の場合も同じ仕様になってるようだったので、user.jsにも流用は効くか、と思われます。

参考

小粋空間
http://www.koikikukan.com/archives/2011/08/29-015555.php

補足情報

本記事で扱っている各プログラムのエディションおよびバージョンは次の通り。

  • MT6.0.3
  • MTAppjQuery 1.3.0

関連するタグ

MT6, MTOS5, MTOS5.2.10, MTプラグイン