LoginSignup
0
1

More than 1 year has passed since last update.

[SpringBoot][Vue.js]axios通信のレスポンスヘッダの項目が一部不足していて取得できない

Posted at

環境

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)
0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1