環境
Amazon EC2
Spring Boot
kotlin
Vue.js
Apache
Tomcat
何が起きたか
・EC2上にデプロイしたVue.jsからAPIにアクセスしてAuthorizationヘッダーに設定したトークンを取得しようとしたが、取得できなかった
・console.logで確認したところ、headerの一部の項目が欠落している(Access-Control-Expose-Headersで許可されている項目しか取得できない)
https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/Access-Control-Expose-Headers
・run serveしたローカル環境では取得出来ていた
ハマったポイント
・Apacheでhttpd.confおよび.htaccessにheaderに関する設定は正しく行っていた(何度も確認)
・JavaScriptでheaderの情報が一部しか取れない
・DevToolsのネットワークからレスポンスを見るとheaderの情報は設定されている
原因
・API側でAccess-Control-Expose-Headersに対する許可設定をしないと、JavaScriptで許可されている項目以外は取得できない(Apacheの設定だけでは足りていなかった)
解決方法
・SpringBootでCORSを設定する箇所に以下を記述する
.addExposedHeader(CorsConfiguration.ALL)