Nuxt を Conoha VPS にデプロイする手順
まずは契約してからコンソールでipとかパスワードを確認して、sshで入れるようにしましょう。安くていいですよね。めんどいのでrootで入って操作します。
①Gitをインストールする
いくらでも書いてあるので、それを見てやればいい。
https://qiita.com/tomy0610/items/66e292f80aa1adc1161d
予め用意したNuxtのファイルたちを適当な場所にgitで入れる。
②yarnをインストール
まずリポジトリをインストール
yum install epel-release
nodeをインストール
yum module install nodejs
https://www.softel.co.jp/blogs/tech/archives/6490 等を見ながらnを使ってversionをあげる
npm install -g n
n stable
yum remove nodejs npm
exec $SHELL -l
Yarn リポジトリを有効化
curl --silent --location https://dl.yarnpkg.com/rpm/yarn.repo | tee /etc/yum.repos.d/yarn.repo
GPGキーを追加
rpm --import https://dl.yarnpkg.com/rpm/pubkey.gpg
yarn をインストール
yum install yarn
③pm2を入れる
npm install pm2 -g
とかyarn add で入れればいいと思います。
④とりあえずApacheでページを表示してみる
yum install -y httpd
で Apache を入れる。
service httpd start
とかで動かす。
systemctl enable httpd
しておく。
次にhttpを弾くかないようにする
firewall-cmd --zone=public --add-port=80/tcp --permanent
設定をリロードする
firewall-cmd --reload
そしたらこんな感じで(IPアドレスを指定して)ブラウザから見にいけば、テストページが見に行けるはず。
SSLにするときはまた設定する。
⑤Nuxtで作ったものを見れるようにする
何をするかというと、localhost:3000にリダイレクトするという設定を httpd.conf のファイルに設定していきます。pm2でデーモンで起動するようにします。
まずyarn installでモジュールをインストールしておきましょう。
envファイルを用意している場合、ちゃんと本番用に作っておきましょう
(cp .env.example .env的な)
そしてyarn buildして、yarn startで動かせることを確認しましょう。
次に、Apacheの設定をします。一部だけ掲載します。
# at /etc/httpd/conf/httpd.conf
NameVirtualHost *:80
<VirtualHost *:80>
DocumentRoot /var/www/html
<Proxy *>
Require all granted
</Proxy>
ProxyRequests Off
ProxyPreserveHost On
ProxyPass / http://localhost:3000/
ProxyPassReverse / http://localhost:3000/
</VirtualHost>
service httpd reloadでリロードします。
この時点では以下のようになるでしょう。
less /var/log/httpd/error_logとかでapacheのエラーログを見てみると以下のようになりました。
[Sun Aug 01 17:12:43.321483 2021] [proxy_http:error] [pid 88620:tid 140661588195072] [client クライアントのIPアドレス] AH01114: HTTP: failed to make connection to backend: localhost, referer: http://IPアドレス
まぁlocalhost:3000まだ起動してないからね!!
次にpm2で Nuxt のアプリを起動しましょう。
まずgit cloneしたディレクトリをカレントディレクトリにします。
そんでpm2 start "yarn start" --name アプリの名前にすればokです。
ブラウザから見てみましょう。
わーい！
次に、サーバ起動時にpm2も起動するようにしましょう。pm2を先程のまま起動している状態で、
pm2 startupしてからpm2 saveしましょう。
pm2 saveしてからcat /root/.pm2/dump.pm2してみると、ちゃんと今起動しているアプリの情報が書かれていることがわかります。
最後にrebootによって再起動してみましょう！うまく動きました！
続きは Laravel を Conoha VPS 上で連携させます.
https://qiita.com/YSY/items/3a5f824aad81863ed881
※以下のエラーが出た時
Permission denied: AH00957: HTTP: attempt to connect to 127.0.0.1:3000 (localhost) failed
/usr/sbin/setsebool -P httpd_can_network_connect 1
により解決した.
画像をFTPでアップロードできるようにした
vsftpを入れて、https://qiita.com/morih90/items/56aec95f25c0158848b0 などを参考にしながら21番を開ける。lsofとかでポートが空いてることを確認する。
クライアントはなんでもいいけどmacだとデフォでsftpが入っている。
put 作成したユーザ@ドメイン
put -r hoge_dir
とかでアップロードできる。
ssl.confに以下のようにProxyPassを追加し、画像を見れるようにした。
ProxyPass /api http://127.0.0.1:81/api
ProxyPass /storage http://127.0.0.1:81/storage
Apacheの再起動とかNuxtの.envのリロードを忘れないようにする.