Help us understand the problem. What is going on with this article?

Lambda内からcloudfrontへのaxiosリクエストが403になる

ニッチなネタですが、同じくお困りの方がいらっしゃったらご参考にどうぞ

アーキテクチャ

cloudfront -> api gateway -> lambda(nuxt)

この環境で

nuxt(axios) -> (out bounds) -> HTTP API(cloudfront)

このようにaxiosを利用して外部のサービスで、そのサービスがcloudfrontを利用している場合、その通信は403となり失敗します。

原因

axiosでリクエストする際に付与しているヘッダー情報に原因がありました。
viaです。
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Via

これはcloudfrontで付与されて、そのままapi gateway、lambdaへと引き継がれ、axiosのデフォルトヘッダーに設定されていました。

改善

cloudfrontでは多段構成を禁止する仕組みとしてこのviaを利用しているようで、このヘッダーを消すことで無事疎通が可能となりました。

nuxt(plugins)
export default ({ $axios }: Context) => {
  $axios.defaults.headers.common = {}
}

※この例では初期設定値をすべて消しています。

kubotak
フロントエンドが好物 これでもサーバーサイドエンジニア
https://kubotak.page
macloud
M&Aクラウドは「テクノロジーの力で、M&Aに流通革命を」をミッションにM&Aプラットフォーム「M&Aクラウド」を開発運営するスタートアップです。
https://macloud.jp
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした