Paroday

Paroday：ニュースやアニメのレビュー、FC2ブログのテンプレート・プラグインなどを配信しています。

もしかして Parody ではありませんか？　yes

Chrome FC2ブログ等のプレビューでJavaScriptが機能しない　拡張機能「X-XSS-Protection ZERO」で有効にする方法

  • 2013-02-27 水 00:20
  • Web
  • hatena  拍手

　Google Chromeでブログ記事などをプレビューしたときに記事内のJavaScriptが機能しないときがあります（外部ファイル.jsやscript要素内の記述が無効になる）。

　エラーメッセージに「Refused to execute a JavaScript script. Source code of script found within request.」と表示されている場合はChromeのセキュリティ対策（XSSフィルタ）が原因のようです。

　このフィルタ機能の動作はサーバ側で設定できてしまうため、無効に設定しているサイトにアクセスした場合は機能しません（閲覧する側の環境にもよる）。そのくらいのフィルタです。いくつか確認したブログサービスの中ではココログとSeesaaが無効にしています。

　上記エラーは送信したパラメータの値にスクリプトのコードが存在し、それと同じコードが表示しようとしているページに含まれている場合に起こります。

　次のフォームの送信ボタンを押すとテキストエリア内のデータ（スクリプト）が「Hello World!」を表示するページ「xss-helloworld.html」に送信されます。

■サンプルフォーム1

　Firefoxなど（設定にもよる）では問題なく「Hello World!」が表示されますが、Chrome（Safariも）では表示されません。「xss-helloworld.html」のソースに送信したスクリプトと同じコードが記述されているためです。

<html lang="ja">
<head>
<title>「Hello World!」を表示するページ</title>
</head>
<body>
<h1>JavaScriptの実行</h1>
<script>document.write('Hello World!');</script>
</body>
</html>

　プレビューは送信したデータをもとにソースが作成されるため、同じようにエラーでJavaScriptがブロックされます。

　末尾の「!」を「!?」に変更すると別のコードになるため、JavaScriptは問題なく実行されます。scirptの終了タグ直前にスペースを入れたり「alert('hoge');」を追加しても同一コードが残っている限りはブロックされます。

■サンプルフォーム2

拡張機能『X-XSS-Protection ZERO』で解決する方法

　自分で指定したページ（信頼できるサイト）でのみ、このセキュリティ対策の『ON』『OFF』が設定できるシンプルな拡張機能です。その他の余計な機能は一切ありません。
　『NO』にすればサイト側がフィルタ機能を無効に設定していた場合でも強制的に有効にすることもできます（信頼できないサイトでのフィルタ無効化阻止）。

インストールの方法

» X-XSS-Protection-ZERO

　上記リンクを右クリックしてリンク先を適当な場所に保存します（名前をつけてリンク先を保存）。

　次にChromeの新しいタブで拡張機能ページ『chrome://extensions/』（コピー貼り付けエンター）を開きます。このページはブラウザメニューの[ツール→拡張機能]からも開くことができます。

　開いた拡張機能ページに先ほど保存したcrxファイルをドラッグアンドドロップします。「追加しますか？」のダイアログで「追加」を選択すればインストールが完了します。
　インストールがうまくいかないときはパッケージ化でインストールしてください。

　追加した拡張機能はゴミ箱のアイコンをクリックすればアンインストールできます。アンインストールせずに機能を完全に停止させたいときは有効のチェックを外せば無効になります。

使い方

　初期状態では何のURLも指定されていません。通常の閲覧と同じ状態です。
　URLを指定するときは拡張機能右下の「オプション」をクリックします。

　動作対象ページ入力欄にURLを追加して『登録』ボタンを押せば、そのURLで始まるページでのみフィルタが無効になります。複数のURLを一度に追加するときは改行で区切ります。

　試しに次のURLを登録すればサンプルフォーム1の『Hello World!』が表示されるはずです。

　登録の際には同一URLや既に登録済みのURLは弾かれて残りが新規登録されます。
　『ON』はプレビューなどでスクリプトが機能する状態（フィルタ無効）です。クリックして『OFF』に切り替えれば通常表示に戻ります。さらにクリックして『NO』に切り替えればサイト側の設定を上書きしてフィルタを強制的に有効にします。

　登録するURLは「指定したURLで始まるページ」のため、『http://』から入力する必要があります。途中に指定URLを含むサイトでは機能しません。よくわからないときはFC2ブログなどの登録URLサンプルを参考にしてください。

■「http://headlines.yahoo.co.jp/hl」を登録
・機能するページ例
http://headlines.yahoo.co.jp/hl
http://headlines.yahoo.co.jp/hl?c=dom
など「http://headlines.yahoo.co.jp/hl」で始まるURL
・機能しないページ例
http://go.jp/?url=http://headlines.yahoo.co.jp/hl

　拡張機能が有効になっているかどうかはページのアドレスバーで確認できます。『XSS』の青いアイコンが表示されていれば、そのページで機能しています。登録前から開いていたページはリロードすることで確認できます。

　アイコンが薄い赤色（OFF）の場合やアイコン自体が表示されていないページでは動作していません。

　アイコンを左クリックするとオプションページを開かずに『ON/OFF/NO』を切り替えることができます。アイコンにカーソルを重ねると出てくる[数字]はリストの順番を意味します。例えば[19]と表示されていれば、19番目に登録されたURLが現在のページで適用されていることになります。

　アイコンを右クリックすると拡張機能ページやオプションページを開くことができます。

　そのページに一致するURL指定が複数ある場合は後に追加したURLの設定が適用されます。例えば、『http://go.jp/』が登録済みの状態で新たに『http://go.jp/index』を登録し、『http://go.jp/index.html』にアクセスした場合は『http://go.jp/index』の『ON/OFF』設定が適用されます。

　登録したURLを編集するときはテキストボックス内を直接変更して『更新』ボタンをクリックします。更新せずに元に戻すときはボックス内を空っぽにして更新ボタンを押すかリロードしてください。

　登録したURLを削除するときは右の『削除』ボタンをクリックします。

　現在表示されているリストをまとめて操作したいときは一括処理の『ON』『OFF』『NO』『全削除』ボタンをクリックしてください。例えば、『OFF』を押せばすべてのURLで動作しなくなります。

URLの検索

　リストの左上にある検索テキストボックスで登録したURLの検索表示ができます。
　『fc2』と入力すれば、『fc2』を含むURLのみが表示されます。
　右の『clear』をクリックするとテキストボックスの中身を空にすることができます。

　左の検索セレクトボックスで『ON』を選択すれば、『ON』の状態のURLのみが表示されます。検索テキストボックスに『fc2』があれば、『ON』の状態でかつ『fc2』を含むURLのみ表示することができます。

　検索表示された状態で一括処理の『ON』『OFF』『全削除』ボタンをクリックすれば、現在表示されているURLにのみ処理が実行されます。例えば、『fc2』を検索テキストボックスに入力して一括処理の『OFF』ボタンを押すと『fc2』を含むURLだけが『OFF』の状態になります。

URLのバックアップ

　最下部の『登録URL一覧表示』をクリックすると登録したURLがテキストエリア内にまとめて出力されます。コピーしてメモ帳などに保存しておけば、全削除したりストレージが削除されてもすぐに登録し直すことができます。

正規表現を使う

　「/」と「/」で挟むと正規表現になります。

/^http:\/\/www\.yahoo\.co(\.jp|m)\//

　上記を登録すると「http://www.yahoo.co.jp/」「http://www.yahoo.com/」で始まるURLで機能します。

　「/com/」など多くのサイトで一致するような短い正規表現は避けた方が無難です。先頭一致「^」の利用推奨です。
　「(」の閉じ忘れなどにもご注意ください。

/^http:\/\/www\.yahoo\.co(\.jp|m\//

　正規表現にエラーがあると登録時のnew RegExpチェックで処理が中断されます。

FC2ブログなどの登録URLサンプル

　『X-XSS-Protection ZERO』にどのURLを登録すればいいかわからない場合のサンプルです。基本的にJavaScriptが機能していないページのアドレスをコピーして登録すればOKです。指定したURLで始まるページのため、複数のパラメータが付属するとき（?preview&indexなど）は、「&」以降をカットして登録するか、そのすべてのページを登録してください。

FC2ブログ

　プレビューでJavaScriptが機能しない主なページは「記事（ブログアドレス+?editor）」「テンプレート（ブログアドレス+?preview）」「プラグイン（ブログアドレス+?plugin）」の3つです。

http://自分のブログアドレス/?editor
http://自分のブログアドレス/?preview
http://自分のブログアドレス/?plugin

　上記3行を追加すればプレビューでJavaScriptが機能するようになります。
　このブログの場合だと以下の3行です。

http://paro2day.blog122.fc2.com/?editor
http://paro2day.blog122.fc2.com/?preview
http://paro2day.blog122.fc2.com/?plugin

　以下に自分のブログアドレスを入力してボタンをクリックすると自動で登録URLが作成されます。URL版か正規表現版のどちらかを登録してください。両方登録する必要はありません。



■URL版

■正規表現版

　正規表現版は1行で1つのブログの記事・テンプレート・プラグインのURLを指定することができます。正規表現がよくわからない場合は登録後に編集・更新せずそのままご利用ください。変に編集するとエラーで機能しなくなります。

　次の1行だけでも機能しますが、『?no=1』などのページでも動作するようになります。

http://自分のブログアドレス/?

So-netブログ

　登録するURLは以下です。記事プレビューでJavaScriptが動作します。

https://blog.so-net.ne.jp/_pages/user/auth/

ヤプログ

　記事とスキンのプレビューでJavaScriptが動作します。記事の「プレビューを表示する」にチェックしていると繰り返し実行されるので外してからプレビューしましょう。

http://www.yaplog.jp/core/PreEntry
http://www.yaplog.jp/skin/TemplatePreview

忍者ブログ

　記事とデザイン（別タブ）のプレビューでJavaScriptが動作します。

http://自分のアドレス/hoge/TemplatePreView/
http://自分のアドレス/hoge/TPV

その他

■ローカルサーバ

http://localhost/
http://127.0.0.1/

■https://のみ

https://

拡張機能をcrxファイルでインストールできないとき

　管理しやすい場所に適当なフォルダを作成します。名前は『X-XSS-Protection』でも何でも構いません。
　そして以下の9つのファイルをそのフォルダの中に保存します。

　保存が完了したらChromeの拡張機能ページを開いて[デベロッパーモード]にチェックを入れます。
　『パッケージ化されていない拡張機能を読み込む』をクリックして作成したフォルダを選択すればインストール完了です。

拡張機能を使わずに起動オプションで無効にする方法

（※注意）この方法はすべてのサイトでXSSフィルタが無効になります。

　Google Chromeを起動するショートカットのリンク先に、XSSフィルタを無効にするオプションを付けてブラウザを起動させれば、スクリプトが機能するようになります。

　最初に起動のショートカットをコピーします。次にコピーしたアイコンを右クリックして【プロパティ】を選択。ショートカットタブの[リンク先]の末尾に『 --disable-xss-auditor』を付けます。

　以上で完了です。あとは全般タブでショートカットの名前を『(XSS)Chrome』などに変更して区別できるようにしておきます。

　オプションを有効にするにはChromeのウインドウをすべて閉じてから起動する必要があり、オプションなしに戻す場合もすべて閉じてから通常のショートカットリンクを起動し直す必要があります。また環境によっては正常に適用されない場合もあります。

関連記事
  1. comment

  2. paruparu 2013-03-01 16:15 No.1853 #-URL

    テンプレートプレビューの時に スクリプトが動作しないのがストレスだったのですが、無事問題なくプレビューでも動作するようになりました。 記事のプレビューでも一部の javascript が確認できなくて、仕方なくFirefox などに移って作業していましたが、これからはその必要もなさそうです。
    いつもありがとうございます。 感謝！

    それと、私は Sleipnir3（Webkit版） を使っているので、この拡張 を使わせてもらうことで十分足りるのですが、 「Chrome に --disable-xss-auditor」 の方法は、私の環境では上手く設定できないようです。 リンク先を書き換えようとすると、

    受け側に指定されたパス名
    'C:\Users\[ユーザー名]\AppData\local\Google..（略）\--disable-xss-auditor'
    は無効です。パスとファイル名が正しいか確認してください。

    というようなメッセージが出てショートカットを作ることができませんでした。
    Win7 × Chrome25 です。 私の環境だけのことかもしれませんが、一応ご報告まで。

  3. paruparu 2013-03-05 14:34 No.1862 #-URL

    すみません.. 『 --disable-xss-auditor』 でもOKでした。
    頭の半角スペースを抜いてしまったという初歩的ミスでした。 申し訳ありません。

  4. nana 2014-09-30 00:04 No.4521 #SFo5/nokURL

    windows7でChrome最新版を使用しています。
    拡張機能をインストールし、再起動すると、強制的に無効化され、有効にすることができなくて困っています。
    拡張機能を使わない方法もありますが、全てのページで有効になることには抵抗があるので、拡張機能のウェブストアへの追加をお願いしたいのですが可能ですか？

  5. PARO 2014-10-03 01:29 No.4524 #-URL

    こんばんは。
    申し訳ございませんが登録の予定はございません。

    代わりの方法になるかはわかりませんが、このページの「拡張機能をcrxファイルでインストールできないとき」にあるファイル・画像をすべて保存したフォルダを作成し、そのフォルダを拡張機能ページ上にドラッグ＆ドロップすると有効にインストールすることが可能です（デベロッパーモードにチェックを入れた状態で）。
    現在はこの方法で正常な動作を確認しています。

    ただし、ブラウザを立ち上げた際に「デベロッパーモードの拡張機能を無効にする」を毎回キャンセルする必要がありますが…。
    ご了承くださいませ。

コメント

Icon ※必須 :
Pass 　※入力した英数字を識別コードとしてNoに表示(123→LkZag.iM)