55
54

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

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

Last updated at Posted at 2013-12-09

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

問題

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を使ったやり方の方が評価されてます。お好みで!

 

55
54
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
55
54

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?