Xserverの仕様について&SSH接続でLaravel+Vue.jsをデプロイしてみた(※Dockerは使えないことが発覚)

はじめに

前回AWSへのデプロイを試していました。

諸々仕組みはわかりましたが、料金面を考えると現在契約しているXserverで運用できた方がいいなと思ったのでSSHでのデプロイに挑戦してみました。

※Dockerはインストールできないことが発覚したので、普通にgit cloneでデプロイしてみます。

※以下、以前FTPでデプロイした際の記録

【Laravel】AWSで作ったWebアプリをXserverにデプロイする※FTP経由

✅ゴール
・DockerとXserverの理解を深める

✅参考
LaravelのアプリケーションをXserverで動かす方法|PHP&MySQL&Apache2
かなり詳しく諸々の設定書いてある。インフラ寄り。

Laravelのアプリを生成してブラウザで確認するまで（Cloud9とエックスサーバー）
1つ前の記事でphpのバージョンを変更できずかなり参考になった。

LaravelをXserverにデプロイする流れ – ウェブカツでプログラミング学習中 –
こちらも割と詳しめ。上記よりWebアプリのデプロイについて書かれている。

覚えておきたいlsコマンドのオプション15選
-lオプションや-aオプションはまさにあったらいいなといった機能だったので知れて嬉しい。

Xserverのスペック確認

✅Xserverのスペック

確認するとLinuxだと判明！

✅XserverへのSSH接続　参考

サーバー名：~~music.xsrv.jp(僕の場合)

ユーザー名：~~music

パスフレーズ：SSH設定時に記載の内

1つのドメインに付き、フォルダ構成はこんな感じになる。

xserver_phpにphp.iniがあるだけでそれ以外はすっからかんのフォルダ。

役割はこんな感じらしい。参考

シンプルにサイト上に公開したい内容はpublic_htmlに公開。

それ以外はほかのディレクトリに置けば基本的にOKですね！

✅PHPのバージョン変更　参考

※画像の参照先

衝撃の事実。XserverのPHPのバージョンは5.4.16でした。。。古い。。。

php -v
PHP 5.4.16 (cli) (built: Nov 1 2019 16:04:20)
Copyright (c) 1997-2013 The PHP Group
Zend Engine v2.4.0, Copyright (c) 1998-2013 Zend Technologies
with Zend OPcache v7.0.5, Copyright (c) 1999-2015, by Zend Technologies

普段ローカルでもDockerでもPHP 7.3.11を利用しているのでこれに合わせていきます。

以下で使えるPHPのバージョンを確認。どうやら7.3.11はないみたいなのでドメインでも推奨の7.3.14に切り替えます。

find /opt/php-*/bin -type f -name 'php'
/opt/php-7.2/bin/php
/opt/php-7.3.14/bin/php
/opt/php-7.3.4/bin/php
/opt/php-7.3.8/bin/php
/opt/php-7.3/bin/php
/opt/php-7.4.3/bin/php
/opt/php-7.4/bin/php

設定を置くためのディレクトリを作成

mkdir $HOME/bin

シンボリックリンクを作成

ln -s /opt/php-7.3.14/bin/php $HOME/bin/php

パスを通す　参考

vi ./bash_profile // これはエラー
vi ~/.bash_profile // こっちだと見つかった。

※.bash_profileは個人の環境変数を編集するファイル

PATH=$HOME/bin:$PATHを追加。

変更の有効化

source ~/.bash_profile
php -v
PHP 7.3.14 (cli) (built: Jan 25 2020 00:32:14) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.3.14, Copyright (c) 1998-2018 Zend Technologies

デプロイ

以前はFTPでやってましたが、さすがに技術的に見るとあれなのでSSHでのデプロイに再度挑戦です。

【Laravel】クラフトビールまとめサイトを作ってみた。

※user/<ドメイン名>を基準に操作していきます。

git clone https://github.com/chobi1125/laravel-sns-mysql.git
ls // 確認
>> autoreply  laravel-sns-mysql  mail         script
   htpasswd   log                public_html  xserver_php
mv laravel-sns-mysql laravel

composerをインストールしてvendorディレクトリを生成

cd laravel
composer install

publicディレクトリを移動(※これは後述のnpm i&devやったほうが最終的には良い。)

cd ..
mv laravel/public public_html // これだとpulbicディレクトリも含めて移動だった。。。
mv public_html/public/* public_html //publicディレクトリのフォルダを全て移動

public_html/index.phpの編集

※変更前

require __DIR__.'/../vendor/autoload.php';
$app = require_once __DIR__.'/../bootstrap/app.php';

※変更後

vi public_html/index.php
~~~~
iキー
require __DIR__.'/../laravel/vendor/autoload.php';
$app = require_once __DIR__.'/../laravel/bootstrap/app.php';
escキー
:wq</pre>

laravel/.envファイルを生成

<pre><span style="font-size: 0.9em;">cd laravel
cp .env.example .env
php artisan key:generate
</span>vi .env
~~~~
APP_URL=http://独自ドメイン/
DB_connection=mysql
DB_HOST=自身のサーバ名.xserver.jp
DB_PORT=3306
DB_DATABASE=自身のデータベース名
DB_USERNAME=自身のユーザー名
DB_PASSWORD=自身で設定したパスワード

※データベース自体はXserverのサーバーパネルから作成(※コマンドではログインできないっぽい。。。)。

マイグレーション

cd laravel
php artisan migrate

ドメインにアクセスして確認すると以下エラー

The Mix manifest does not exist.

以下で解決。

✅nodebrewのインストール

npm i
npm run dev

ただXserverではnpmコマンドが使えない。。。

コチラを参考にNodeのインストール。

※こちらも参考：XSERVER(エックスサーバー)にNode.jsをインストールするときはnodebrew使うと楽

wget git.io/nodebrew
perl nodebrew setup
echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.bashrc
source ~/.bashrc
nodebrew -v // コマンドが使えるか確認
nodebrew install latest // 最新版をインストール
nodebrew install stable // 安定版
nodebrew list // ダウンロードした一覧
nodebrew use v14.3.0 // バージョン指定して使う
node -v
>> v14.3.0
npm -v
>> 6.14.5

再度npm i&dev実行で以下エラー(※以前も出たやつ)

Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '@babel/compat-data/corejs3-shipped-proposals'

package.jsonに以下を追記して再度npm i&devで解決。

"devDependencies": {
  "@babel/preset-env": "=7.9.0" // これ

これを実行した後再度、public/jsディレクトリに生成されたファイルを<ドメイン名>/public_htmlディレクトリに移動。

確認。

※厳密には、再度アクセスするとThe Mix manifest does not exist.エラーが出たのでpublic_htmlからlaravel/publicディレクトリにmix-manifest.jsonのみ移動したところ正常に動作。

追記：削除ボタンが表示されないことが判明。原因不明なのでわかり次第更新します。

おわりに

XserverでDockerなど追加ソフトウェアはインストールすることができないことが今回わかりました。

おそらくhomeディレクトリ下のファイルも見れないので、随時PHPのバージョンなどはXserver側(root権限として)から更新されるんだろうなといった感じ。

なので今回はとりあえずgit cloneしてLaravelアプリをデプロイ。

ちなみに上記の理由然り公式からもPostgreSQLは利用できないと書かれてます。なんか色々と掴めてきた感がある。

リポジトリ

デプロイしたアプリ

※画像参照先

✅参考
LaravelをXserverにデプロイする流れ – ウェブカツでプログラミング学習中 –
LaravelのアプリケーションをXserverで動かす方法|PHP&MySQL&Apache2
WordPressウェブサイトのPHPバージョンをアップグレードする手順（とその理由）
WordPressもPHP7.3をおすすめしてた。。。(今更感)
2019年4月からWordPressのphpバージョンは5.6以上が必要になるよ！
どうやらXserverはサイト上から切り替えられる模様。
当サイトはバージョン7.3.14だった。どういうことだろう。。。

備忘録

✅Dockerはインストールできないことが発覚！！

ここからは今までの知識で挑戦していきます。

AWSにLaravel+Laradockをデプロイしてみる

Gitの確認(既に入ってる)

git --version
git version 1.8.3.1

Dockerのインストール

apt-get install \apt-transport-https \ca-certificates \curl \gnupg-agent \software-properties-common

と、ここでDockerをインストールできないことが発覚！！笑

✅.xsrv.jpなる初期ドメインがあることを知った。

✅Xserverはsudoできない　参考

どうやらroot権限は使えないらしい。

参考：エックスサーバーにLinuxbrewでPythonをインストール

どうやら権限パスワードを3回ミスするとユーザーのホームディレクトリにインストールされるらしい。

✅シンボリックリンクと.htaccessの設定　

※このやり方は.htaccessの理解が浅く失敗しました

参考：Xserver(レンタルサーバー)でLaravelを動かす

ページ確認すると以下エラー。ページ遷移するとエラーが発生する。

諸々編集前の状態に戻す。

mv public_html/* laravel/public // 諸々、元の場所に戻す
vi laravel/public/index.php

以下でシンボリックリンクの作成。

ln -s $HOME/asobi.fun/laravel/public $HOME/asobi.fun/public_html/index.html

これでアクセスするとエラーが発生。おそらくURLにindex.htmlがついてしまうのが原因と思われる。

これに関しては以下記事が参考に。

参考：XServer に Laravel 5.8 プロジェクトを GitHub からデプロイする

.htaccessに以下を追記

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule ^(.*)$ public/$1 [QSA,L]
</IfModule>

シンボリックリンクの作成

ln -s $HOME/asobi.fun/laravel/public ./public // ./publicを記載せずともpublicディレクトリが生成される模様

ところがエラー。

.htaccessの書き方を覚えなきゃダメそう。
Xserver公式⇒サーバーパネルで編集できる。