WordPressセキュリティを考える会第6回開催しました。

WordPressセキュリティを考える会第6回開催しました.
ネタがWordPressとjQueryの連携、ということもあり、開催前にスライドが2000view行く等、注目されたイベントになりました。

スライドでは、HTML5のカスタムデータ属性、wp_localize_script、esc_jsの3通りを紹介しました。スライドの補足として、JSONについて記載したいと思います。

JSONについて

JavaScript Object Notation(JSON)は、テキストベースのデータフォーマットです。プログラム間でデータを受け渡しするとき等でデータをいったん出力しなければならないときに、JSON形式で出力することがあります。

wp_localize_scriptを使う方法は、WordPressからJSONを出力する、そのJSONをJavaScriptのプログラムから読み取る、という仕組みです。

テキストデータなので、自分でJSONを組み立てることも理論上は可能です。しかし自分で組み立てると構文のミス等の危険が高まるので、通常はプログラム言語に用意されている方法を利用します。フレームワークやライブラリを使っている場合はそれらのお作法で作ると良いでしょう。

JSONのHTMLエスケープ

json_encode のHTMLエスケープには注意が必要です。会でも取り上げましたが、wp_localize_scriptの生成するJSONはHTMLエスケープされないです。

もちろん、この事自体は致命傷では有りません。JSで出力する場合に、きちんと注意する必要がある、ということですから。

PHPフレームワークとJSON

PHPフレームワークではどうなっているでしょうか。

FuelPHP1.7.2ではデフォルトでHTMLエスケープ済みのJSONを生成します。

fuel17

<?php

class Controller_Jsonsample extends Controller_Rest
{
    public function action_index() 
    {
        $array = array('data' => '<b>abc</b>');
        return $array;
    }

}

CakePHP2.4.10ではデフォルトではHTMLエスケープされないJSONを生成します。

cake24

<?php

class JsonsampleController extends AppController {
    public function index() {
        $this->viewClass = 'Json';
        $this->set('data', '<b>abc</b>');
        $this->set('_serialize', array('data'));
    }
}

デフォルトでHTMLエスケープする／しないを確認しておかないといけませんね。

セキュリティをもっと知りたい方へ

連載書籍 WordPress セキュリティニュースでは、今回の勉強会で紹介したHTML5のカスタムデータ属性を使う方法、wp_localize_scriptを使う方法、について解説しています。興味のある方はお読みいただけると嬉しいです。

※ WordPress(PHP) からjQuery(JavaScript)に動的に値を渡す方法を言い値書店で販売開始しました。 購入者はデモで使ったテーマ／攻撃コードがダウンロード可能です。サンプルテーマでは、bxsliderを利用しました。