[JavaScript] サニタイジング(エスケープ) メソッド

“サニタイジング jquery”」などのような検索ワードで当ブログへのアクセスが沢山ありますので、JavaScriptやjQueryでサニタイジングメソッドを実装してみました。

#JavaScriptでエスケープ

function htmlentities(str) {
    return String(str).replace(/&/g, "&")
              .replace(/"/g, """)
              .replace(/</g, "&lt;")
              .replace(/>/g, "&gt;");
}

分かりやすいように上記のように書きましたが、以下のように短くできます。

function htmlentities(str) {
    return String(str).replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
}

特に処理をしないのであれば、こちらの方がスマートですかね。

#jQueryでエスケープ

ちょっと見当が付かなかったのですが、調べてみると色々とあるようです。

$.htmlentities = function(val) {
    return $("<div/>").text(val).html();
}

jQuery上で生成したdivにテキストとして値を挿入。
そこからhtml()(innerHTML)で値を取得するという荒業です。
素直にreplace()した方が無難ではないかと個人的に思います。

ちなみにjQueryには$.parseHTML()なんてメソッドがありますが、こちらはサニタイジングとは毛色が異なりますのでご注意を。
(<script>などを無効化してくれるようなやつです)

twitterfacebookhatenafacebook