woshidan's blog

あいとゆうきとITと、とっておきの話。

AngularJSからRails 4.0へHTTPリクエストを投げるとき詰んだこと

RailsのCSRF対策の仕組みについて - Programming log - Shindo200

を読んでました。

 

恥ずかしいから、張り切って書かない。

 

Rails側で

protect_from_forgery with: :exception

と設定していてInvalidAuthenticityToken エラー が発生

  • CSRFトークンをヘッダーにつける
  • authenticity_tokenをフォームに埋め込む

などの対策をしているか? GET,HEADリクエスト以外のリクエストではないか。

 

APIなど用にRails側で

protect_from_forgery with: :null_session

と設定しているのに、Angularからリクエストしたとき、認証がうまくいかない。

とりあえずディレクトリだけ先に移したとかでAPI用の認証メソッドにもしかしてクッキーをお使いで?(はやくcookieじゃなくてAPIキーにしようよ……)

=> AngularJS側でXSRF対策が必要(ドキュメントには対策を用意している、と書かれていて任意っぽく見えるけれど、デフォルト設定だと、CSRF(XSRF)トークンをヘッダーにセットしてあげないとcookieの読み書きが制限される)

 

自分の場合はcurlcookieつけてPOSTリクエスト送ったら使えていたので、多分ここ。

 

Cookieが使えない、と検索すると

AppModule.app
         .config(['$httpProvider', function($httpProvider){
                  $httpProvider.defaults.withCredentials = true;
                  }]);

って出てくるのですが、これを書くと、jsのパラメータと一緒にcookieの値が送られるようになります。

withCredentialsについては、 

十三章第一回 XMLHTTPRequest — JavaScript初級者から中級者になろう — uhyohyo.net

 

jsで通信していると、普通はwebブラウザで表示しているので、

webブラウザがcookieを持っているので、ここの設定は忘れてたし(汗)、

実際送らなくてもブラウザ側がcookieの値持ってるような……。

 

patchやputのリクエストではheaderにjson形式でデータが送られると言う設定の

Content-Type: "application/json;charset=utf-8"

がないから$httpの一部メソッドは動かないで、

$http.patch method is not a fuction

みたいに出てきて検索した結果、

javascript - configure angularjs module to send patch request - Stack Overflow

が出てきたのですが、とりあえず、

ショートカットメソッドが動かない場合は、

$http({ method: 'method', url: url });

の形式で書いてみたら動きました。

このショートカットメソッドが存在するかどうかは、バージョンに依存します。

v1.2.12ではドキュメントによると、

が使えるそうな。

バージョンを確認するのは大事ですね。

 

今回の、

ぐぐるよりドキュメント読んで黙々と条件出ししたほうが速いような気がした。

あるいはドキュメントでぐぐる