Nuxt2系で発生した事象です
表題通りの事象が発生した
もう少し具体的に説明するとCloud Run上のNuxtJSから別のCloud RunのWEBAPIにアクセスするとまれに「ERROR getaddrinfo ENOTFOUND ドメイン名」が発生する。WEBAPI側はカスタムドメインのみリクエストを行い、Cloud Runによる割り当て済みのドメインにはリクエストをしない。
めちゃくちゃ雑だけど以下みたいな構成。
Cloud Runによる割り当て済みのドメインとカスタムドメインはCloud RunのURLで確認できる
ERROR getaddrinfo ENOTFOUND xxx
DNSの名前解決に失敗したときに発生するエラー。ただ、今回のケースはNuxtJSのSSRでリクエストするとまれに発生する。SPAでリクエストする場合は発生しない。さらにこのエラーが発生している際に他で直接WEBAPIを叩いたりSPAでリクエストしても発生しない。Cloud Runによる割り当て済みのドメインにリクエストするとこのエラーが発生しない。この事象が発生する自分の環境ではSentryを用いてエラーハンドリングしているが、Sentryでは補足されない(もちろんWEBAPI側のエラーハンドリングも補足されない)。Cloud Runのログで判明したのでアプリケーション側で判断できないのもめちゃくちゃしんどい😭
ググるとよく出てくる解決策
いくつか解決策が出てくる
- ドメインのタイポが多い
- hostsファイルに記述する
- プロキシを無効にする
3つ目のプロキシを無効にするではこちらの記事にaxiosでproxy:false
にすると解決すると書かれていたが、NuxtJSではデフォルトがfalseなので今回とは関係がなさそう。issueに同じ現象の人がいるが解決出来てないみたい。
baseURLとbrowserBaseURLを使い分ける
baseURLはSSRからリクエストするURL、browserBaseURLはSPAでリクエストするURL。おそらくSSRの際に何かしらの理由でDNSの名前解決出来ないのだろうと思ったので、baseURLにCloud Runによる割り当て済みのドメイン、browserBaseURLにカスタムドメインを設定し前述した事象を回避した。これらのオプションは環境変数で上書きされるため環境変数に書いておけばnuxt.config.jsに書く必要がない。自分は以下のように.envに記載した。
# baseURL
API_URL={Cloud Runによる割り当て済みのドメイン}
# browserBaseURL
API_URL_BROWSER={カスタムドメイン}
nuxt.config.jsに書く場合
※API_URL、API_URL_BROWSERの環境変数を利用している場合は以下のように記述しても上書きされてしまうので注意
axios: {
baseURL: 'cloud run url',
browserBaseURL: 'custom url',
}
- Options - nuxtjs/axios
https://axios.nuxtjs.org/options/#baseurl
(解決策)proxyを利用する
proxyを利用してCloud Runによる割り当て済みのドメインにアクセスする方法です。問題となったカスタムドメインは利用しないのでこの方法が一番良いはず
axios: {
proxy: true,
},
proxy: {
'/api/': {
target: 'cloud run url',
pathRewrite: { '^/api/': '' },
},
},
- Options - nuxtjs/axios
https://axios.nuxtjs.org/options/#proxy
最後に
とりあえず「ERROR getaddrinfo ENOTFOUND xxx」は起きなくなったのでよかったが、回避策なのでいまいち腑に落ちない。結構調べたが明確な解決策が出てこないのでもし知ってる方がいましたら教えてください🙇♂️なんとなくだがCloud RunのコールドスタートかDockerが関係しているような気もするが...
...
タイミング的にアドベントカレンダーの時期なので便乗させてもらいました、特に面白い内容じゃなくでごめんなさい🙇♂️