3

シンプルなデータをステータスとしてFBに投稿するシンプルなアプリがあります。残念ながら、FBはAPIから入ってくるデータやAPIから出て行くデータをサニタイズしないことがわかりました。これに対処するために、簡単に言えば、答えはAPIからの応答をサニタイズすることです。

要するに、私が欲しいものは、次のコードスニペットの36行目に示されています。(テストの例として、FBにログインし、このアプリに代わって投稿する権限を与えたら、文字列「<iframe src = "http://www.google.com"></iframe>」を投稿します。 Enterキーを押すと、FB内の壁にサニタイズされて表示されますが、この単純なページにはiframeが表示されます)。

<!DOCTYPE html>
<html>
<head>
    <title>Sanitize my FB Data</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"
        type="text/javascript"></script>
    <script src="../../lib/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<input id="fbPost" type="text">

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function () {
    FB.init({
        appId      : "my_app_id",
        status     : true, 
        cookie     : true,
        xfbml      : true,
        oauth      : true
    });
    $("#fbPost").keyup(function (event) {
        if (event.keyCode == 13) {
            var data = {
                message: $("#fbPost").val()
            };
            FB.api('/me/feed', 'post', data, function (resp) {
                var _index = resp.id.indexOf("_");
                var postId = resp.id.substr(_index + 1);
                FB.api('/' + postId, function (postData) {
                    // This line is insecure!
                    $("body").prepend(postData.message);

                    // Would like: sanitize(postData.message)
                });
            });
        }
    });
};
(function(d){
    var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<div class="fb-login-button" 
    scope="read_stream,publish_stream">
    Login with Facebook
</div>
</body>
</html>

つまり、JavaScriptでデータをサニタイズしたいと思います。JavaScript SDKのみを使用してFBデータの読み取り/書き込みを行い、サーバー上で完全にFBユーザー情報に手を差し伸べることを好むアプリの場合、これは明らかな問題です。

Cajaの内部サニタイザーを使用してこの回答を確認しましたが、残念ながら、「html4」グローバルオブジェクトを使用する必要があります。JavaScriptの他の入力サニタイザーを知りません。

つまり、今日JavaScriptで利用できる包括的な入力サニタイザーはありますか?

4

2 に答える 2

1

この関数をスクリプトに追加します。

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

次に使用します。

$("body").prepend(htmlEscape(postData.message));
于 2014-05-06T15:04:53.343 に答える
0

ここで必要なのは、受信したデータに対して HTML エンティティ エンコーディングを実行することだけです。受け入れられた回答の関数は機能します。既にUnderscoreを使用している場合は、_.escape関数が同じものを提供します。

于 2014-06-01T13:34:41.610 に答える