Help us understand the problem. What is going on with this article?

AngularJSでPOSTした時にRailsのCSRFトークンを付与する

More than 5 years have passed since last update.

なんかタイトルが変ですが。

問題

Railsで(Railsに限らずですが)、POSTリクエストしようとするとCSRFのトークンが必要になります。

通常のRailsのPOSTであれば、問題ないのですが、
angularJSから($resouceとか$httpで) 何もせず、POSTした場合に、
Can't verify CSRF token authenticityというWARNがrails側で発生します。

これはリクエストにCSRFトークンが含まれていないため。

失敗した場合はreset_sessionが実行される(はず)。

解決方法

で、angular側でCSRFトークンを付けるには$httpProviderのheaderでトークンをセットする。

app = angular.module(App, [])
app.config ["$httpProvider", ($httpProvider) ->
  $httpProvider.defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content')
]

上記の場合だとGETにも付いてしまうので、
GETメソッド以外に付ける場合は以下のようにする

app.config ["$httpProvider", ($httpProvider) ->
  csrfToken = $('meta[name=csrf-token]').attr('content')
  $httpProvider.defaults.headers.post['X-CSRF-Token'] = csrfToken
  $httpProvider.defaults.headers.put['X-CSRF-Token'] = csrfToken
  $httpProvider.defaults.headers.patch['X-CSRF-Token'] = csrfToken
  $httpProvider.defaults.headers.delete['X-CSRF-Token'] = csrfToken
]

-

ネタ元:
Rails CSRF Protection + Angular.js: protect_from_forgery makes me to log out on POST

※ただ、こちらのスレッドではRails側でCookieを使ったやり方の方が評価されてます。お好みで!

 

kyohei8
おはようございます。
http://www.twopipe.com
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away