ApacheポートフォワーディングでNuxt×Golang
- 掲載日
- 更新日
はじめに
このサイトはフロント側をNuxt3、バックエンド側をGolang(Gin)で作成しています。
(ポートフォリオサイトの方にGitHubへのコードも載せています。)
本当はApacheではなくNginxなどを使った方がいいんだと思いますが、今回自分の構成ではApache上にそれぞれデプロイしていきます。
そのため、同じドメインで以下のように振り分けたくなりました。
- フロント(Nuxt)をポート3000で起動し、example.comにアクセスしたらポート3000に転送
- API(Gin)をポート3001で起動し、example.com/api/XXX にアクセスしたらポート3001に転送
ポートフォワーディングを使って振り分ける
上記のような振り分けをする時に便利なのがポートフォワーディング(ポート転送)という機能。
sslで対応する場合はssl.confに以下のように記載します。
RewriteEngine On
SSLProxyEngine On
ProxyPass /api http://localhost:3001/api
ProxyPassReverse /api http://localhost:3001/api
ProxyPass / http://localhost:3000/
ProxyPassReverse / http://localhost:3000/
注意点
地味な詰みポイントとして、転送は記述した上から順に実行されるので、
ProxyPass / http://localhost:3000/
を最初に書くと、すべてのページがNuxt側に転送されてしまい、/apiにアクセスしてもGolang側に転送されません。(1敗)

この記事を書いた人
- A.W.
- 茨城県在住Webエンジニアです。 PHPなどを業務で使用しています。 趣味ではGoやNuxt、Flutterをやってます。