Spring SecurityでCORSの設定を行う




どうも高妻です。Twitterでプログラミングのことや暗号通貨のことをつぶやいているのでよかったらフォローしてください。  

CORSとは

Cross-Origin Resource Sharingの略で、ブラウザがHTMLを読み込んだサーバ以外から安全にデータを取得できるようにする仕組みです。一番最初にHTMLを読み込んだサーバーをオリジンと呼びます。

a-site.comから最初のHTMLを取得して、b-site.comからjsやcssを取得

するときb-site.com側でCORSの設定を行います。

その設定内容はオリジンがa-site.comだったらjsやcssをブラウザに返しますよという設定になります

Spring SecurityでのCORSの設定方法

Spring Securityを使うとログイン、CSRF、CORSなどの設定が簡単にできます。

インストール

gradleでインストールする場合は下記をbuild.gradleに追加するだけです。

CORS設定

CORSはこれだけの設定で完了です。kotlinで書いているので適宜Javaに読み替えてください。

今回重要なのは、addAllowedOrigin()にa-site.comを登録しているところです。この設定をすることでオリジンがa-site.comのブラウザからのアクセスを許可することができます。

CORS設定の簡単なテスト方法

テスト方法はまずCORS設定前にローカル環境にNginxを立てて下記HTMLでa-site.comにアクセスします。

nginxのインストールと起動はこれ(Macの場合)

/usr/local/var/www/sample.htmlとして下記HTMLを作成します。

作成後にhttp://localhost:8080/sample.htmlにアクセスしてa-site.comからレスポンスが正常に取得できることを確認します。この後にCORS設定をしてからアクセスしてレスポンスがエラーになっていればちゃんとCORS設定ができています。

このようにCORSをちゃんと設定することでクロスドメインからのアクセスを制限することができます。

まとめ

  • CORSとはブラウザがHTMLを読み込んだサーバ以外から安全にデータを取得できるようにする仕組み。
  • Spring Securityを使うと簡単に設定できる。

最近だと、SPA(シングルページアプリケーション)でサイトを作ることが多くなってきているのでCORSについてしっかりと知っておく必要があるかと思います。

CORSの仕組みを理解していればこのようなちょっとした設定でも迷うことなくできるようになるのでこの際にしっかりと学んでみてください。

The following two tabs change content below.

高妻智一

2013年CyberAgent新卒入社 スマホゲームを作る子会社に所属し、サーバーサイドのエンジニアを担当。2年目の終わりから新規子会社の立ち上げに参加し、サーバーサイドのエンジニアリーダーとしてサービースのリリースから運用までを担当。 現在はTwitterなどSNSのテキスト解析を行うソーシャルメディア分析のサーバーサイドを開発中。言語はNode.js、Kotlinを使用。






コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です