全局添加X-CSRF-Token標頭到XMLHttpRequest（）的所有實例;

Question

我使用的是第三方的庫，產生一個原始XMLHttpRequest與new XMLHttpRequest 。

這繞過了我的CSRF保護並被我的rails服務器擊落。

有沒有辦法在實例化時將全局添加預定義的CSRF令牌（ $('meta[name=csrf-token]').attr('content') ）添加到XMLHttpRequest所有實例？

Answer 1

我建議攔截對send方法的調用 ：

(function() {
    var send = XMLHttpRequest.prototype.send,
        token = $('meta[name=csrf-token]').attr('content');
    XMLHttpRequest.prototype.send = function(data) {
        this.setRequestHeader('X-CSRF-Token', token);
        return send.apply(this, arguments);
    };
}());

這不會在實例化時添加標頭，而是在發送請求之前添加標頭。 您也可以攔截對new XMLHttpRequest()調用，但這不會有用，因為您需要等待添加標頭直到調用open 。

您可能還希望包含對請求的目標URL的測試，以便您只在調用自己的api時添加標頭。 不這樣做可能會將令牌泄漏到其他地方，甚至可能會破壞不允許此標頭的跨域CORS調用。

Answer 2

你可以打開ajax open（）方法打開然后立即設置標題：

(function() {
    var op = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function() {
        var resp = op.apply(this, arguments);
        this.setRequestHeader('X-CSRF-Token', $('meta[name=csrf-token]').attr('content'));
        return resp;
    };
}());

Answer 3

如果您需要Jquery獨立解決方案，您可以使用：

  (function() {
      var send = XMLHttpRequest.prototype.send,
          token = document.getElementsByTagName('meta')['csrf-token'].content;
      XMLHttpRequest.prototype.send = function(data) {
          this.setRequestHeader('X-CSRF-Token', token);
          return send.apply(this, arguments);
      };
  }());