バックエンド

【Java】Play FrameworkのCORSFilterを有効化しよう!

play-cors-filter

こんばんは!光です。

大手グローバル企業でWebエンジニアをやっています。

Webエンジニアを目指してプログラミングを勉強している初心者の方向けに情報を発信しています。

経歴や実績はこちら

システム開発のお仕事の依頼もお待ちしております。

お問い合わせページTwitterのDMからお気軽にお問い合わせください!

今回はこのような質問をいただきました。

Play Frameworkで作成したAPIがAjaxで叩けない!

デフォルトの設定だとCORSエラーが起きてしまうんですよね。

そこで今回はこちらの質問について解説していきます!

環境
  • Play Framework 2.7

CORSFilterを有効化しよう!

特に設定をしないと以下のようなエラーが起きると思います。

Access to XMLHttpRequest at ‘http://localhost:9000/’ from origin ‘http://localhost’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

そこでapplication.confを修正します。

初期状態であればplay.filtersは定義されていると思うので、その中に1行追加するだけです。

play.filters {
  enabled += play.filters.cors.CORSFilter
}

これでCORSFilterが有効化されてAjax通信が可能になるはずです。

詳細な設定はplay.filters.corsで行えます。

play.filters {
  cors {
    # Filter paths by a whitelist of path prefixes
    #pathPrefixes = ["/some/path", ...]

    # The allowed origins. If null, all origins are allowed.
    #allowedOrigins = ["http://www.example.com"]

    # The allowed HTTP methods. If null, all methods are allowed
    #allowedHttpMethods = ["GET", "POST"]
  }
}

設定値はこちらを参考にしてください。

まとめ

この記述を追加してCORSFilterを有効化するだけ!

play.filters {
  enabled += play.filters.cors.CORSFilter
}

あとがき

これでPlay frameworkで作成したAPIをコールすることができるようになりました。

たった1行で直りますがハマることも多いエラーだと思います。

APIとして使う場合はCORSFilterを有効化しておきましょう!