rails環境構築時にいつも引っかかるcorsについて

railsで開発する時に環境構築して初回にいつもcorsで引っかかって これってなんだっけ〜となるので改めてまとめてみる。

改めてcorsとは

cross-origin-resorce-sharingの略。 あるoriginで動作しているアプリケーションが、他の異なるoriginにアクセス出来るように、ブラウザに指示する仕組み。

そもそもoriginとは

何となくURLの事かな〜とか考えていたけど、以下の記事に明確に定義されていた。 ウェブコンテンツのoriginとは、

• URL

• スキーム

• ホスト

• ポート

によって定義される。

例えば

https://domain-a.comで提供されているウェブアプリのフロントが https://domain-a.comhttps://domain-b.com/data.jsonへリクエストを行う場合は 正しいcorsヘッダーを含む必要がある。

プリフライトリクエストとは

実際のリクエストを送信する前に、OPTIONSメソッドによるHTTPリクエストを他のドメインに送り、 実際のリクエストを送信しても安全かどうかを確かめる。

RailsでOPTIONSが通らない場合

以下の様に、cors.rbに通信を許可したいoriginを記載することで通るようになる。

Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins 'http://localhost:9010/'

    resource '*',
      headers: :any,
      methods: [:get, :post, :put, :patch, :delete, :options, :head]
  end
end

デフォルトだとGemfileの

gem 'rack-cors'

がコメントアウトされているので、戻すのを忘れずに。

参考文献

• corsについて：オリジン間リソース共有 (CORS) - HTTP | MDN
• originについて：Origin (オリジン) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN