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

1 min read
hiroweb developer

"サニタイジング 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>などを無効化してくれるようなやつです)