Play frameworkで作成したAPIをAjaxで呼び出そうとしたらこんなエラーが。
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.
よく見るクロスドメインによるエラーですね。
Play frameworkの場合はCORSFilterを有効化するだけで、こちらを解決できます。
設定
今回はPlay framework2.7を使用しています。
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"]
}
}
設定値はこちらを参考にしてください。
まとめ
これでPlay frameworkで作成したAPIをコールすることができるようになりました。
たった1行で直りますが、ハマることも多いエラーだと思います。
APIとして使う場合はCORSFilterを有効化しておきましょう。
ABOUT ME