5

csrf トークンの生成を使用して Web アプリケーションを保護することに興味があります。私の質問は、クエリ パラメータまたは http ヘッダー x-csrf-token を使用して、そのトークンをサーバーに送信する方法です。

そして、違いは何ですか

4

2 に答える 2

9

Express を使用しているため、CSRF ミドルウェア (Connect による) を使用できます: http://www.senchalabs.org/connect/csrf.html

ここでコメント付きのソースをチェックアウトできます: https://github.com/senchalabs/connect/blob/master/lib/middleware/csrf.js

あなたがする必要があるのは、そのミドルウェアをインクルードしてから、POST フォーム (または、状態を変更するリクエストを PUT など) に変数_csrfを設定して値を持つことですreq.session._csrf。

ここで例を確認してください: https://github.com/senchalabs/connect/blob/master/examples/csrf.js

アップデート

req.csrfToken()Connect 2.9.0 以降、代わりに使用する必要がありますreq.session._csrf

完全な例: https://github.com/senchalabs/connect/blob/master/examples/csrf.js

コミット: https://github.com/senchalabs/connect/commit/70973b24eb1abe13b2da4f45c1edbb78c611d250

更新2

接続ミドルウェアは、さまざまなモジュール (および関連するリポジトリ) に分割されました。それらはすべて (CSRF を含む) ここで見つけることができます: https://github.com/senchalabs/connect#middleware

于 2012-05-24T08:12:16.923 に答える
3

私の見解では、csrfフォームを送信するときは、非表示のフィールドでPOSTパラメーターを使用する必要があります。これが唯一の方法です。

X-CSRF-Tokenただし、AJAXリクエストの場合は、代わりにヘッダーを使用することを強くお勧めします。主な理由は、正しく実行されれば、POSTリクエストごとにトークンを追加することを覚えておく手間が省けるからです。または、jQuery Formなどのライブラリを使用する場合、送信時にPOSTパラメーターを追加するとハックになる可能性があります。

たとえば、AJAXリクエストにjQueryを使用する場合、リクエストが行われる前に自動的かつ透過的に設定するために使用できるフックが提供されます。X-CSRF-Tokenしたがって、クライアント側のコード変更はほとんど必要ありません。そして、あなたはあなたのコードの素晴らしさを急上昇させます。

-

Djangoのプロジェクトに基づいて、事実上すべてのプロジェクトで正常に使用している実装例は次のとおりです。

jQuery(document).ajaxSend(function(event, xhr, settings) {

  function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
      var cookies = document.cookie.split(';');
      for (var i = 0; i < cookies.length; i++) {
        var cookie = jQuery.trim(cookies[i]);
        // Does this cookie string begin with the name we want?
        if (cookie.substring(0, name.length + 1) == (name + '=')) {
          cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
          break;
        }
      }
    }
    return cookieValue;
  }

  function sameOrigin(url) {
    // url could be relative or scheme relative or absolute
    var host = document.location.host; // host + port
    var protocol = document.location.protocol;
    var sr_origin = '//' + host;
    var origin = protocol + sr_origin;
    // Allow absolute or scheme relative URLs to same origin
    return (url == origin || url.slice(0, origin.length + 1) == origin + '/') ||
           (url == sr_origin || url.slice(0, sr_origin.length + 1) == sr_origin + '/') ||
           // or any other URL that isn't scheme relative or absolute i.e relative.
           !(/^(\/\/|http:|https:).*/.test(url));
  }

  function safeMethod(method) {
    return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
  }

  if (!safeMethod(settings.type) && sameOrigin(settings.url)) {
    xhr.setRequestHeader("X-CSRFToken", getCookie('csrf.token'));
  }
});

サーバー側では、CSRFトークンを含むCookieを設定するだけで、クライアントがトークンを簡単に取得できるようになります。を次のように置き換えましたapp.use(express.csrf())：

app.use((function(options) {

  var csrf = express.csrf(options);

  return function(req, res, next) {

    function onCsrfCalled() {
      var token = req.session._csrf;
      var cookie = req.cookies['csrf.token'];

      // Define a cookie if not present
      if(token && cookie !== token) {
        res.cookie('csrf.token', token);
      }

      // Define vary header
      res.header('Vary', 'Cookie');

      next();
    }

    csrf(req, res, onCsrfCalled);
  }
})());
于 2012-05-24T11:54:57.213 に答える