MTOS管理画面のSSL化(プラグイン編):MTAppJQueryのMTAppMultiCheckbox() を使えるようにする
※本記事は、MTAppjQueryプラグインの基本的な使い方が分かっている事を前提としています。
MTOSの管理画面にSSLを適用したら、MTAppMultiCheckbox() が効かない
user.js に適用してた MTAppMultiCheckbox() が効かなくなってました。
多分JSのパスがミスってるんだろう、とFireBugで確認してみると、案の上でした。
FireBugに出てたメッセージ(一部修正):
混在アクティブコンテンツ "/xxxx/user.css?v=20140417215602" の読み込みをブロックしました
混在アクティブコンテンツ "/xxxx/user.js?v=20140418175900" の読み込みをブロックしました
混在アクティブコンテンツ "/xxxx/user.css?v=20140417215602" の読み込みをブロックしました
管理画面のhtmlソースを見ると、MTAppjQueryで読み込んでるJSやCSSの一部に、http://からの絶対パスで読み込んでいるものがありました。
今回は、これを是正してみます。
修正の試行
修正箇所は、[MTAppjQueryの本体ディレクトリ]/lib/MTAppjQuery/Callbacks.pm.
具体的には、271 - 300行目あたりです。
本箇所には、管理画面のhtmlソースに出力するuser.css /user.js のURLを定義する箇所があります。
271 - 300行目あたりのソース:
### user.jsをセット
require MT::Template;
my $user_js_url;
my $user_js_tmplname = MT->config->MTAppjQueryUserJSName || 'user.js';
my $user_js_tmpl = MT::Template->load({name => $user_js_tmplname, identifier => 'user_js', blog_id => $blog_id});
if (defined($user_js_tmpl)) {
$user_js_url = $blog->site_url . $user_js_tmpl->outfile . '?v=' . $user_js_tmpl->modified_on;
} elsif ($op_userjs_url ne '') {
$user_js_url = $op_userjs_url;
} else {
$user_js_url = "${static_plugin_path}user-files/user.js";
}
my $user_js = ($op_userjs == 1) ? qq(<script type="text/javascript" src="$user_js_url"></script>): '';
### user.css をセットする
my $user_css_url;
my $user_css_tmplname = MT->config->MTAppjQueryUserCSSName || 'user.css';
my $user_css_tmpl = MT::Template->load({name => $user_css_tmplname, identifier => 'user_css', blog_id => $blog_id});
if (defined($user_css_tmpl)) {
$user_css_url = $blog->site_url . $user_css_tmpl->outfile . '?v=' . $user_css_tmpl->modified_on;
} elsif ($op_usercss_url ne '') {
$user_css_url = $op_usercss_url;
} else {
$user_css_url = "${static_plugin_path}user-files/user.css";
}
my $user_css = ($op_usercss == 1) ? qq(<link rel="stylesheet" href="$user_css_url" type="text/css" />): '';
前述ソースより、user.jsを読み込むためのscriptタグの最終的なソースを、$user_js 内に代入している事が分かります。
また、user.css においても然りです。
これを、次のように書き換えます。
### user.jsをセット
require MT::Template;
my $user_js_url;
my $user_js_tmplname = MT->config->MTAppjQueryUserJSName || 'user.js';
my $user_js_tmpl = MT::Template->load({name => $user_js_tmplname, identifier => 'user_js', blog_id => $blog_id});
if (defined($user_js_tmpl)) {
$user_js_url = $blog->site_url . $user_js_tmpl->outfile . '?v=' . $user_js_tmpl->modified_on;
} elsif ($op_userjs_url ne '') {
$user_js_url = $op_userjs_url;
} else {
$user_js_url = "${static_plugin_path}user-files/user.js";
}
#>>修正:URLをルート相対に変換
$user_js_url =~ s/(http|https)\:\/\/[^\/]+//g;
#<<
my $user_js = ($op_userjs == 1) ? qq(<script type="text/javascript" src="$user_js_url"></script>): '';
### user.css をセットする
my $user_css_url;
my $user_css_tmplname = MT->config->MTAppjQueryUserCSSName || 'user.css';
my $user_css_tmpl = MT::Template->load({name => $user_css_tmplname, identifier => 'user_css', blog_id => $blog_id});
if (defined($user_css_tmpl)) {
$user_css_url = $blog->site_url . $user_css_tmpl->outfile . '?v=' . $user_css_tmpl->modified_on;
} elsif ($op_usercss_url ne '') {
$user_css_url = $op_usercss_url;
} else {
$user_css_url = "${static_plugin_path}user-files/user.css";
}
#>>修正:URLをルート相対に変換
$user_css_url =~ s/(http|https)\:\/\/[^\/]+//g;
#<<
my $user_css = ($op_usercss == 1) ? qq(<link rel="stylesheet" href="$user_css_url" type="text/css" />): '';
具体的に何をやったかというと、$user_css_url, $user_js_url に正規表現をかけてスキーム(http:// or https://)とホスト(例えば www.example.com )の文字列を除去しています。
なお、191行目・216行目にも、管理画面htmlソースのJSコード内にURLを書き出すコードがありますが、本箇所については、ルート相対にすると逆に動作がおかしくなったので、そのままで良いようです。
191行目
blogURL = '<mt:if name="blog_url"><mt:var name="blog_url"><mt:else><mt:var name="site_url"></mt:if>',
216行目
"blog_url" : "<mt:if name="blog_url"><mt:var name="blog_url"><mt:else><mt:var name="site_url"></mt:if>",
結果
ブラウザのオリジンエラーは解消され、MTAppMultiCheckbox() もちゃんと動いてくれています。
ただ、細かい確認はしてないので、他の機能に影響が出ているか否かは不明です。
(修正内容を見る限りでは、特に影響するような修正はないと思うので、大丈夫とは思いますが、、、(๑´ڡ`๑) )
補足情報
本記事で扱っている各プログラムのエディションおよびバージョンは次の通り。
- MTOS5.2.10
- MTAppjQuery 1.3.0