EC2にLaradock+Nuxtをアップした際の対応
概要
ログイン等の認証機能を持つ予約ページを作成してみようと思い、どんな構築にしようかと考えた結果、ネット上に資料が多そうなLaravelとVueが使えるのでNuxtを使用することにした。
最初はLaravelとNuxtを別々にしようかと思っていたけど、Laradockを使って同一レポジトリの構成というのが面白そうだったのでこちらを採用。使えないと困るdockerも用いるので勉強に使うのも良いと思う。
この記事がとても参考になりました→https://qiita.com/gemetasu1103/items/3a6d495b37623dc2e89a
ローカル環境では特に詰まることもなく開発できて動作確認も問題なかった。
だが、そのソースコードをそのままAWS EC2にアップしたところnpm install
やcomposer install
といったパッケージインストールでエラーが発生したり、ssh接続を切るためにnpm run star
やphp artisan serve
をバックグラウンドで実行する必要が発生した。他にもdocker内部からホスト側にアクセスさせるところでうまくいかなかったりした。
上記の様にローカルでうまくいったのにサーバーで発生した不具合への対応を記録しておく
先に結論を言うと、パッケージインストールと権限問題に関してはchown、バックグラウンド起動/停止はnohup、docker内部からホストへのアクセスはEC2のセキュリティグループで解決しました。
- パッケージインストール時のエラー対応→chown
- バックグラウンド起動/停止スクリプト作成→nohup
- storage/logs周りの権限問題→chown
- EC2でdocker内部からホストにアクセス→EC2セキュリティグループ
パッケージインストール時のエラー対応
npm install
でパッケージインストール中にのエラーが発生した。
内容はnode_modules/にあるフォルダに書き込みをしたいのにpermission deniedだからできないとあった。
とりあえずchmod 777
をしようかと思ったが、なぜか思い止まってls -la
で権限を確認したところ、ownerがrootとなっていた。ここでownerがlaradockになっていたファイルがいくつかあることを思い出し、chown laradock:laradock -R node_modules
を実行した。
実行後、再度パッケージをインストールするとエラーが発生せずにうまくいった。
試してないがchmod 777 -R node_modules
でもできるかもしれない。
なぜownerの変更でいけたのかが理解できていないので調べておく必要がある。
バックグラウンド起動/停止スクリプト作成
Laravel, Nuxtの起動でそれぞれphp artisan serve
, npm run start
を実行するが、サーバーへのssh接続を切断するとこれらのプロセスが終了してしまう。そもそもdockerのコンテナ内で実行するのでコンテナから抜け出す時点で既にプロセスが終了してしまう。
nuxtバックグラウンド起動で検索するとforeverが出てくるが、laravelの起動もあったので合わせてnohupで起動/停止スクリプトを作成することにした。 sh start.sh
で起動、sh stop.sh
で停止できるように以下のスクリプトを作成した。
start.sh
#! /bin/sh
nohup php artisan serve > /var/www/init.d/output/laravel.`date "+%Y%m%d_%H%M%S"` 2> /var/www/init.d/error/laravel.`date "+%Y%m%d_%H%M%S"` & nohup npm run start > /var/www/init.d/output/nuxt.`date "+%Y%m%d_%H%M%S"` 2> /var/www/init.d/error/nuxt.`date "+%Y%m%d_%H%M%S"` &
stop.sh
#! /bin/bash ps aux | grep -E "php.*serve" | grep -v grep | awk '{ print "kill", $2 }' | sh ps aux | grep -E "npm|node" | grep -v grep | awk '{ print "kill", $2 }' | sh
start.shは、nohupで起動してログを出力している
stop.shは、起動中のプロセスIDを取得しそれをkillしている
- nohupスクリプト参考(https://stackoverflow.com/questions/25438177/how-to-let-php-artisan-serve-run-as-a-background-server-to-work-like-apache)
- nohupログ出力方法(https://kazmax.zpp.jp/linux/nohup_stdout.html)
storage/logs周りの権限問題
起動はできたようなのでブラウザでアクセスして確認してみると、Laravelでエラーの画面が表示された。
権限がないため書き込みができないようだった。
パッケージインストールでのエラーと同様にchown laradock:laradock -R storageとしたら解消された。
検索したら他の対応法も出てきた(試してはいない)
他のLaradockのpermission denied対応(https://qiita.com/cheekykorkind/items/6518dffe8655a18580d3)
EC2でdocker内部からホストにアクセス
Nuxtを起動後にブラウザからアクセスしてもしばらくローディングした後に動作していませんと表示されてしまっていた。
Laravelはテスト用のAPIに直接アクセスしたらちゃんとレスポンスがあったので初めは原因がよくわからなかった。
nohupで出力したログにもport3000でListenしてるよ、と出ているしnginxにはproxy設定でルートへのアクセスはport3000に繋がるようになっているはずなんだが。。。ローカルではlocalhostまたは直接localhost:3000で動作確認できたのに。
調べたこととしては、まずdocker内部からホストのport3000にアクセスできているのかというところだが、ローカルではlocalhostで表示されていたのでこれは問題なさそう。
問題なさそうだか、これ以外に心当たりがなかったのでしばらくnginxのproxy設定をいろいろいじっていた。(localhost:3000, host.docker.internal:3000 ...etc)
ふとEC2インスタンスのセキュリティグループのことを思い出したので確認したところ、httpとsshしか外部からの接続は許可していなかったので、port3000のを許可に加えてみたらうまくいった。
docker内部からのアクセスも外部からのアクセスになってしまうのかと疑問が残る解決となった。
まとめ
以上の対応でサーバーアップしたものを無事にブラウザで確認することができた。
Webでフロントエンドとバックエンドを両方一人で一通り作ってみたのは初めてだったのでとても面白くて勉強になることが多かった。
次はRailsを使って同じものを作って違いをいろいろと比較してみたい。