無法在Rails + React App中驗證CSRF令牌

我有一個使用Rails和React的應用程序。 Rails中的AJAX部分工作正常，但我有一些使用AJAX的React組件，並且通過React組件在AJAX請求中發生錯誤。無法在Rails + React App中驗證CSRF令牌

我得到以下錯誤：加入這

2017-10-17T15:36:26.933083+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905- 
5be9f6839c5b] Started POST "/quiz_submissions" for 162.158.165.188 at 2017-10-17 15:36:26 +0000 
2017-10-17T15:36:26.935109+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905- 
5be9f6839c5b] Processing by QuizSubmissionsController#create as JSON 
2017-10-17T15:36:26.935151+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905-5be9f6839c5b] Parameters: {"quiz_submission"=>{"quiz_problem_id"=>"21", "checked_option_ids"=>["88"]}} 
2017-10-17T15:36:26.935688+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905-5be9f6839c5b] Can't verify CSRF token authenticity. 
2017-10-17T15:36:26.936459+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905-5be9f6839c5b] Completed 422 Unprocessable Entity in 1ms (ActiveRecord: 0.0ms) 
2017-10-17T15:36:26.937451+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905-5be9f6839c5b] 
2017-10-17T15:36:26.937485+00:00 app[web.1]: [14b2fc9e-80b7-490f-b905-5be9f6839c5b] ActionController::InvalidAuthenticityToken (ActionController::InvalidAuthenticityToken):

我試過在阿賈克斯頭添加CSRF令牌我main.js

$.ajaxSetup({ 
    beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', 
    $('meta[name="csrf-token"]').attr('content'))}, 
});

這工作完全沒我的本地計算機上，但在生產環境（Heroku）上給出相同的錯誤。

另外，我也試着在陣營Component內個別Ajax請求的報頭附加的CSRF令牌如下：

$.ajax({ 
     dataType: 'JSON', 
     type: 'POST', 
     url: '/quiz_submissions', 
     context: this, 
     headers: { 
      'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') 
     }, 
     data: { 
     ... 
     } 
     }

這種方法也適用本地正常，但給出了生產相同Can't verify CSRF token authenticity.錯誤。

我有我的頭部分<%= csrf_meta_tags %>我也有//= require jquery_ujs我application.js

任何想法，爲什麼它不生產環境在Heroku上工作？

來源

2017-10-17 Swojeet

事情很少;首先，Rails在後臺執行某些魔術，以自動將CSRF令牌應用於未獲取的請求。所以你不需要做任何這個。它不起作用的事實表明應用程序中的csrf標記設置不正確。我猜這是由於有一個異步登錄頁面（使用反應而不是傳統的HTML表單構建），因此在登錄時不會設置CSRF標記。您可以通過從登錄帖子收到的信息登錄後手動更新CSRF標籤來解決此問題。 – gravityplanx

我使用設計的登錄表單。我有其他部分使用ajax（不在反應組件），我沒有得到任何'無法驗證CSRF令牌的真實性.'這些不響應ajax請求的錯誤，所以我不認爲這可能是一個問題與登錄頁面，可以嗎？ – Swojeet

試試這個=>'https：// stackoverflow。com/questions/7203304/warning-cant-verify-csrf-token-authenticity-rails＃answer-43138944' – 7urkm3n

可能，這應該起作用。

LINK HERE !!!

使用jquery.csrf（https://github.com/swordray/jquery.csrf）。

的Rails 5.1或更高

$ yarn add jquery.csrf

//= require jquery.csrf

的Rails 5.0或之前

source 'https://rails-assets.org' do 
    gem 'rails-assets-jquery.csrf' 
end

//= require jquery.csrf

源代碼

(function($) { 
    $(document).ajaxSend(function(e, xhr, options) { 
    var token = $('meta[name="csrf-token"]').attr('content'); 
    if (token) xhr.setRequestHeader('X-CSRF-Token', token); 
    }); 
})(jQuery);

來源

2017-10-18 19:58:37 7urkm3n

Hey @ 7urkm3n，我添加了'jquery.csrf'和ajax，而我在本地預編譯我的資產並將其推送到heroku。但是，如果預編譯的資產heroku它說： 'Sprockets :: FileNotFound：找不到類型爲'application/javascript''的文件'jquery.csrf' 我在ruby buildpack和預編譯之前將nodejs buildpack添加到heroku資產成功，但我得到相同的'無法驗證CSRF令牌真實性.'錯誤。 – Swojeet

你是如何在本地安裝的？ – 7urkm3n

你的意思是'jquery.csrf'？我運行了'yarn add jquery.csrf'並在我的'application.js'中包含了'// = require jquery.csrf''。我刪除了AJAX請求上擁有CSRF標記的頭文件，它在本地和在heroku上工作，但是拋出了這個錯誤： 'Sprockets :: FileNotFound：無法找到類型爲'application/javascript''的文件'jquery.csrf'在Heroku上預編譯資源的。 – Swojeet

無法在Rails + React App中驗證CSRF令牌

回答

相關問題