Laravelをさくらインターネットのレンタルサーバにデプロイ・アップロードする方法をまとめてみた

Laravelをさくらインターネットのレンタルサーバにデプロイ・アップロードする方法をまとめてみた

先日、数人で作業をしている時に、Laravelのプロジェクトをさくらインターネットにデプロイ・アップロードをする機会がありました。

せっかくのよい機会だと思ったので、ブログにまとめてみることにしました!細かく丁寧に説明するつもりなので、「デプロイ・アップロード方法がわからない」「うまくデプロイ・アップロードできない」と困っている方の、お力添えになれたら嬉しいです!

目次

Laravelをさくらインターネットのレンタルサーバにデプロイ・アップロードする上での事前準備

まずは、Laravelで作ったプロジェクトデータをさくらインターネットのレンタルサーバにデプロイ・アップロードする上で、事前に準備しておいていただきたいことをご紹介します!

ポイントは以下の3点です!
(準備ができていると言う方は、読み飛ばしていただいて大丈夫です・・・!)

  • 契約しているさくらインターネットのサーバ情報。特にサーバに関する情報(パスワードなど)は必要ですよ!
  • さくらインターネット上でデータベースを作成する
  • GitHub(アカウントがない場合は作成)にLaravelのデータをpushする。

基本的にはこの3つでOKです。

事前準備その1・さくらインターネットのサーバ情報について確認する

さくらインターネットのサーバに関する情報が必要だ!ということをお話させていただきましたが、具体的には以下の情報が必要になります!

  • ホスト名(FTPサーバ名)
  • さくらインターネットのアカウント名(FTPアカウント)
  • サーバパスワード

上記3つの情報は、さくらインターネットのレンタルサーバ申し込みをした際に、さくらインターネット側から届く「仮登録完了のお知らせ」というタイトルのメールの中に記載されています。

さくらインターネットから届く仮登録のお知らせメールの中でサーバ情報が書かれている部分

実際に届く「仮登録のお知らせ」の中で、必要な情報が書かれた部分を画像で掲載してみたので、参考にしてくださいね!

事前準備その2・さくらインターネットのレンタルサーバ上でデータベースを作成する

次に、今回のLaravelプロジェクトをさくらインターネットのレンタルサーバ上にアップロード・デプロイして公開した際に使用するデータベースを作成します。

さくたインターネットのサーバコントロールパネルにログインをしていただいた後、左サイドバーのメニューから「Webサイト/データ」→「データベース」を選択し、その後に出てくる画面から「新規作成」というボタンを選択します。

サーバコントロールパネルからデータベースを選択
データベースのページが開いたら新規作成を選択
さくらインターネットのサーバコントロールパネルでデータベースを作成する画面

「データベース新規作成」画面が出てきたら、データベース名を入力してください。

また、初めて作成する際は「接続用パスワード」を設定するための入力欄が表示されているはずなので、パスワードを新規作成するようにしましょう!

ここまでできたら、「同意する」のチェックボックスにチェックを入れて、「データベースの作成」ボタンを押します!これで作成はOKです!

さくらインターネットのレンタルサーバにLaravelをデプロイする際に必要な4つの情報

ここまでの作業で作成したものも含めて、この後Laravelプロジェクトデータをさくらインターネットのレンタルサーバ上にアップロードする際には、以下の4つの情報が必要になります!

  • データベースサーバ(~.db.sakura.ne.jpとなっているほうです)
  • データベース名
  • データベースユーザー名
  • 接続パスワード

忘れずに保存などしておいてくださいね!

事前準備その3・GitHub上のリポジトリにデータをプッシュする

最後に事前準備としてお願いしたいのが、LaravelのプロジェクトデータをGithub上のリポジトリにプッシュしておいて頂きたいということです。

なお、2021年8月13日以降、GitHubに接続する際にパスワードによる認証・接続ができなくなりました。そのため、GitHubへの接続方法についてはGitHub・SSH接続の環境設定方法(Mac OS)をご確認ください!

git init
git add .
git commit -m "コミット内容を記入"
git remote add origin ここにGitHubのリポジトリアドレスを入力
(https://github.com/arrown/laravel-project.gitみたいなやつ)
git push origin master

GitHubに接続できる環境が整ったら、ターミナルなどを使ってコマンドライン操作を行い、最低限上記のコマンドを順番に入力していってください!

Gtihubのリポジトリ上にLaravelプロジェクトのデータがpushできた一例

要するに、GitHubにアカウント作って、リポジトリと呼ばれるものを作成し、そこにLaravelプロジェクトのデータをプッシュしていただきたいということなので、そちらをご準備ください!
(プッシュできた時のGitHub上の画面の状況を画像として掲載しておきました)

具体的なデプロイ・アップロード方法の概要について

今回ご紹介するデプロイ・アップロード方法の具体的な流れについて、概要を説明します!

LaravelプロジェクトをGitHub上にプッシュしてからさくらインターネット上にgit pull してデータを引っ張って対応する

事前準備でもお願いしたように、Laravelのプロジェクトデータは、一部をのぞいて GitHub上に送っておきます。

そして、別途ターミナルなどを使ってさくらインターネットのサーバに接続・ログインをしていただきます。

ログインをしたら、LaravelのデータをGitHub上からさくらインターネットのレンタルサーバ内に引っ張ってくるという形をとります!

全体像としては以上のような手順になりますので、抑えておいてくださいね!

ちなみに、これから具体的なアップロード・デプロイの手順を追っていくのですが、事前に知っておいて頂きたい考え方があるので、2つご紹介させていただきます!

考え方その1・Laravelプロジェクト内のデータを3つに分けて考えた上でデプロイする

LaravelはPHPで作られているフレームワークです。

さくらインターネットのレンタルサーバはPHPに対応しているため、Laravelで作成したデータを、適切な方法でサーバ上にデプロイ・アップロードをすれば、問題なく作成したプロジェクトをWeb上に公開することができます。

しかし!Laravelのデータ一式をそのまままるごと、「どーん!」とサーバ上にアップロードすれば良いというわけではないんですね・・・

今回ご紹介するアップロード・デプロイ方法では、Laravelで作成したプロジェクトデータを

  • vendorフォルダ
  • .envファイル
  • それ以外

以上3つに分けて考えた上で、デプロイを進めていきます。

考え方その2・さくらインターネットのサーバ上にターミナルでログインをしてphp artisan migrateなどのコマンドを実行するようにする

もう1つ、考え方の前提として認識をしておいていただきたいことがあります。

今回の記事をお読みいただいている方であれば、Laravelを触って何かを作った経験は当然ながらお持ちかと思います。

Laravelで開発をする中で、「データベース上にテーブルを作成する」ときに、どのようにしたか、覚えていらっしゃいますか??

そう、「php artisan migrate」のようなコマンドを、ターミナルなどのCUIソフトに打ち込み、実行することで、作成していましたよね。

じゃあ、さくらインターネットのレンタルサーバ上にLaravelのデータをデプロイ・アップロードした際や、データの更新をした際に、どこでどうやって「php artisan migrate」などのコマンドを打ち込んで実行すれば良いのでしょう??

お手持ちのPCからターミナルなどを使ってさくらインターネットのサーバにデプロイ

答えは、みなさんお手持ちのPCで、ターミナルなどのソフトを使ってさくらインターネットのレンタルサーバに接続する、です!

こうすることで、「さくらインターネットのレンタルサーバ上でphp artisan migrate」などのコマンドを実行することができます!

GitHubからデータを引っ張って来る時にも、さくらインターネットのレンタルサーバに接続をした上で行うんだよ、というお話は先述した通りですが、同じようにして、artisanコマンドを使うことができるわけなんですね!

/vendor/フォルダ内のデータと.envファイル以外のデータをさくらインターネットのサーバにデプロイする

では最初に、/vendor/フォルダ内のデータと.envファイル以外のデータを、さくらインターネットのレンタルサーバ上にアップロード・デプロイする方法を見ていきたいと思います!

GitHub上にLaravelで作成したプロジェクトのデータをプッシュ済という前提でお話を進めていきますので、その点ご注意くださいね!

さくらインターネットにSSH接続をする

まずは、お手持ちのPCにあるターミナルなどのソフトを使って、さくらインターネットのレンタルサーバ上に接続・ログインをするところからスタートします!

ssh arrown@arrown.sakura.ne.jp 
(ssh FTPアカウント@FTPサーバ名)

ターミナルで上記のようなルールに従ってコマンドを入力します!

ご用意いただいたさくらインターネットのレンタルサーバ情報を確認しながら、ご自身の情報に置き換えてみてくださいね!

入力後、パスワードを聞かれますので、さくらインターネットのレンタルサーバ情報のFTPパスワードを入力し、Enterキーを押します。(パスワードを打ち込んでも画面上には表示されませんので注意!)

ターミナルにログインできた時の状態

接続に成功すると、Webcome To FreeBSD!というメッセージが流れます。これで接続完了です!

.vimrcを使ってさくらインターネット上のサーバに SSH接続後のテキスト・コード編集をしやすくする

まず、さくらインターネット上のレンタルサーバ限定(?)でやっておいた方がいいことがあります。

この後、さくらインターネットのサーバ内にターミナルを使って接続をした状態で、ターミナル上でのコマンド操作によって、さまざまなことを行っていきます。。

その際に、コード編集作業が発生するのですが、さくらインターネットのレンタルサーバの初期設定のままだと、コード編集時に「deleteキー」が使用できないようで、文字を削除する時に著しく不便です。

まずは、deleteキーを使えるように設定を変更するために必要な処理をしていきたいと思います!

cd

上記のようにcdコマンドのみを入力して、一旦サーバ内の現在地を

/home/さくらインターネットのアカウント名

に相当する場所に移動します。続いて、以下のコマンドを入力しましょう。(vimコマンドを使うと、指定したファイルが作成され、中身を編集するための画面に切り替わります)

vim .vimrc

すると、以下のような画面になります。

さくらインターネットのLaravelでvim起動した画面

新しく.vimrcというファイルが作成されます。(まだ未保存状態)

このまま「アルファベットのi(アイ)」を押すと、INSERTモードというものに切り替わり、文字入力・編集をすることができるようになるので、以下のコードを貼り付けましょう。

set backspace=indent,eol,start

貼り付け・入力することができたら、「escキー」を押す→「:wq」と入力して、エンターキーを押します。

すると、.vimnrcファイルの中身を保存することができます。( 「escキー」を押す→「:wq」と入力 、の作業は、編集されたファイルを保存したうえでファイル編集モードから抜け出すという意味です)

これで、deleteキーを使えるようにするための設定が完了です!

GitHub上からデータを引っ張ってくる

次に、GitHub上からデータを引っ張ってきます。

さくらインターネットのレンタルサーバにSSH接続でログインした後、今サーバの中のどこにいるのかを確認してみましょう。

pwd

というコマンドを実行していただくと、現在サーバの中のどこにいるのかを確認することができるようになります。

さくらインターネットのサーバ上でpwdを実行した画面

pwdコマンドを実行した際に、以下のようになっていることを確認してください。

/home/さくらインターネットのアカウント名

/home/さくらインターネットのアカウント名、となっていることを確認したら、GitHubにLaravelのデータをプッシュしたリポジトリのアドレスを確認します。(以下はあくまでも例です。ご自分のものがどうなっているかはしっかり確認してくださいね!)

git@github.com:arrown/laravel-project.git

これでアドレスを確認することができました!

この後の操作についてですが、2021年8月13日以降、Githubにはパスワード認証による接続ができなくなりました。

そのため、GitHub・SSH接続の環境設定方法(Mac OS)GitHub・SSH接続の環境設定方法(Windows)で紹介しているように、SSH接続での認証ができるように設定をしましょう!

上記2つのブログ記事では「自分のPCとGithub」との間でのSSH接続について紹介していますが、今回は「さくらインターネットのレンタルサーバとGitHub」との間でのSSH接続を行う必要があります!

上記2つのブログ記事を参照に、重要な点をピックアップするので、確認してみてください!

  • 1 、さくらインターネットのサーバにSSH接続・ログインしていることを確認し、/home/さくらインターネットのアカウント名にいることを確認した上で、秘密鍵と公開鍵を作成する。(GitHub・SSH接続の環境設定方法(Mac OS)で紹介しているコマンドをそのまま使用しても基本問題ありませんが、”arrown”の部分などは独自の名前に変更してくださいね!)また-f 以降のところで設定するid_rsaの部分(この部分が公開鍵などの名前になります)を変更するかどうかで、以降打っていただくコマンドに若干の変化が生じます。
  • 2 、「Enter passphrase」という感じでパスワードを設定するように求められたら、設定するか、あるいは何も設定せずにただエンターキーを設定するだけでもOKです!
  • 3 、さくらインターネットのレンタルサーバ上にできた~/.ssh/ディレクトリのパーミッションを700にする(chmod 700 ~/.sshコマンドを実行する)
  • 4 、catコマンドで公開鍵の中身をコピーする(cat ~/.ssh/公開鍵のファイル名、というコマンドを入力します。効公開鍵のファイル名は、〜.pubとなっているものです。1の操作において入力したコマンドの-fの部分の名前がid_rsaであればid_rsa.pub、id_rsaから変更した場合は「変更した名前.pub」というファイルになります)
  • 5、GitHubに4でコピーした公開鍵を登録します!(GitHub・SSH接続の環境設定方法(Mac OS)の「3、GitHubに公開鍵を登録」を参考にしてください!)
  • 6、さくらインターネットのサーバ上のconfigファイルに秘密鍵の登録をする(GitHub・SSH接続の環境設定方法(Mac OS)の「4、configファイルに秘密鍵の登録をする」を参考にしてください!)

これで「さくらインターネットのレンタルサーバとGitHub」のSSH接続を行う環境が整いました!

以下のコマンドを実行してみてください!

git clone git@github.com:arrown/laravel-project.git

(git clone GitHubのリポジトリのアドレスは適宜自分のものに置き換えてくださいね!)

(うまくいかない場合は、GitHub・SSH接続の環境設定方法(Mac OS)GitHub・SSH接続の環境設定方法(Windows)などを今一度確認していただき、さくらインターネットのレンタルサーバとGitHub間のSSH接続に関する設定内容を確認してみてください!)

すると、あれよあれよというまにGitHubからLaravelプロジェクトのデータをさくらインターネットのレンタルサーバ上に取り込むことができます。

ここで以下のコマンドを打ってみましょう。

ls
ターミナルでさくらインターネットにログインできた後にlsコマンド実行した画面

すると、サーバ内で現在いる場所にあるデータの一覧が表示されます。

この中に、GitHubから引っ張ってきたLaravelのプロジェクトデータが入っているフォルダ名が確認できれば、ここまでは完了となります!
(僕の場合、laravel-stripe-baseというのがLaravelで作成したプロジェクトデータになります。基本的にLaravelのデータが入ったGitHubのリポジトリの名前がプロジェクトデータのフォルダ名になります!)

vendorフォルダの中身を作成する

次に、vendorフォルダの中身をアップロードします。

さくらインターネットにLaravelプロジェクトをどうデプロイするか

「あれ?Laravelのプロジェクトデータの中にvendorというフォルダもあるのだから、ここまでの作業の中でアップロードできているんじゃないの?」と思った方もいらっしゃるかもしれません。

実は、Laravelプロジェクトのデータの中に「.gitignore」というファイルが存在しています。

このファイルの中身の記述によって、/vendor/フォルダの中身はGitでの管理対象から外れ、GitHubにデータがプッシュされないような設定になっているのです。
(なぜ/vendor/フォルダ内のデータがGit管理対象外になるのかは、下記記事などを参考にしてみてください!)

/vendor/には、Laravelのコア(中心となる)ファイルもたくさん含まれているので、このままではLaravelで作ったプロジェクトデータが動きません。

ということで、/vendor/内のデータを、GitHubからさくらインターネットのサーバ上に引っ張ってきたLaravelのプロジェクトデータ内に用意するための設定を行っていきましょう!

composerインストールをする

まずは、composerをインストールします。 Laravelのデータ自体、composerを使ってインストールするものになっているので超重要な部分です!

pwd

pwdコマンドをターミナル上に入力し、現在「/home/さくらインターネットのアカウント名」の場所にいることを確認していただいたら、cdコマンドを使ってLaravelプロジェクトの中に移動します。

cd Laravelのプロジェクト名

※今回の記事のサンプルでいうと以下になります。
cd laravel-stripe-base

再びpwdコマンドを入力し、

/home/さくらインターネットのアカウント名/Laravelプロジェクト名
(例:/home/arrown/laravel-stripe-base)

が表示されればOKです。

続いて以下のコマンドをターミナルなどのCUIソフトに入力して、実行しましょう!

curl -sS https://getcomposer.org/installer | php

すると、ゴニョゴニョと画面が動き出します。

All settings correct for using Composer
Downloading…

Composer (version 2.1.9) successfully installed to: /home/さくらインターネットのアカウント名/Laravelプロジェクト名/composer.phar
Use it: php composer.phar

引き続き、以下のコマンドを入力します!

php composer.phar

すると、composerがあっという間にインストールされます!以下のような画面が表示されたらcomposerのインストール完了です!

composerがインストールできた状態

composerを使って/vendor/のデータをインストールする

composerをインストールすることができたら、Laravelの/vender/データをインストールしていきましょう!

以下のコマンドをターミナル上に入力し、実行してください!

php composer.phar install
さくらインターネットのサーバ上でcomposer installを実行

上記画像のような画面になれば、/vendor/フォルダ内に相当するデータをインストールすることができた状態になります

lsコマンドをターミナル上に入力すると

Laravelのプロジェクトデータ

Laravelプロジェクト内のデータ一覧が表示されるかと思いますが、vendorが表示されていれば、ここまでの作業は成功です!

.envファイルをサーバ上のLaravelプロジェクトに複製する

ここまでで、Laravelのプロジェクトデータの大半をアップロード・デプロイすることができました!

続いて、Laravelプロジェクトとデータベースを接続するための設定を行っていきます!

.envファイルを作成する

では、いよいよLaravelプロジェクトのデータと.データベースを接続するための設定をしていきましょう!

まずは、以下のコマンドをターミナルに入力・実行し、Laravelプロジェクトの中に再び移動します。

cd laravelプロジェクト名

移動をすることができたら、以下のコマンドを実行し、.envファイルの元データを新規作成します。

vim .env

すると、先ほど.vimrcファイルを作成した時と同じような画面になりますので、ローカル上で作成していた.envファイルの内容を貼り付けてください!

.envファイルの中身を入力する

貼り付けをすることができたら、データベースに関連する部分のみ、「さくらインターネットのレンタルサーバで作成したデータベース」の情報になるように、関連部分を書き換えします。(それ以外の部分については、元々PCなどで開発していた時に使用していた.envファイルの中身を参照し、コピペで貼り付けるなどしてください!)

DB_CONNECTION=mysql
DB_HOST=データベースサーバ
DB_PORT=3306
DB_DATABASE=さくらインターネットのレンタルサーバで作成したデータベース名
DB_USERNAME=さくらインターネットのアカウント名
DB_PASSWORD=データベースパスワード

事前準備の段階で確認頂いたさくらインターネットのレンタルサーバに関する情報や、作成頂いたデータベースの情報をしっかりと確認し、ご入力くださいね!

貼り付け・入力することができたら、「escキー」を押す→「:wq」と入力して、エンターキーを押します。

これで、.envファイルの設定はOKです!

php artisan key:generateをする

続いて、アプリケーションキーの設定をします!以下のコマンドを入力しましょう!(Laravelのプロジェクト内にいることを確認してくださいね!)

php artisan key:generate

入力し実行をした後、「Application key set successfully.」というメッセージが表示されれば、アプリケーションキーの設定完了です!

php artisan migrate

では、 Laravelプロジェクトとデータベースが接続できているかを確認する意味も含めて、ターミナル上でphp artisan migrateを実行しましょう!

php artisan migrate

実行して、以下のような表示になれば、OKです!

php artisan migrateを実行した画面

エラーが出る場合は、エラー内容を確認してみてください!

データベースの接続情報が正しいかなど、エラー内容に応じて諸々確認しましょう!

ここまでで、ほとんどの設定は完了になります!

Laravelプロジェクトのpublicディレクトリをwww内に同期させる

いよいよ、設定・作業も佳境です!

今の状況を改めて確認すると、Laravelプロジェクトが以下の場所に存在する形となります。

/home/さくらインターネットのアカウント名/Laravelプロジェクト名

しかし、さくらインターネットのレンタルサーバにおいては、

/home/さくらインターネットのアカウント名/www

の中にあるデータがインターネット上に公開されるという決まりがあるため、このままではLaravelで作成したプロジェクトの内容をWebブラウザで確認することができません。

wwwフォルダ内に、最低限必要なファイルのみを複製・移動する必要が出てきます。この時の方法として、

  • 当該ファイルを一通りコピー・移動させる
  • シンボリックリンクを使う(laravelプロジェクトのpublicフォルダとwwwフォルダ内を同期させる)

のいずれかの方法があるのですが、今回は後者の方法である「シンボリックリンクを使用する」方法を取りたいと思います!

(※この方法を採用する理由としては、前者の方法よりも後者の方法の方がデプロイ後の更新作業が簡単にできるというメリットがあるからです!)

シンボリックリンクを使ってlaravelプロジェクトのpublicフォルダとwwwフォルダ内を同期させる

それでは、以下のコマンドを打ち込んでシンボリックリンクを貼ってみましょう!

ln -s /home/さくらインターネットのアカウント名/Laravelプロジェクト名/public /home/さくらインターネットのアカウント名/www/任意のフォルダ名(ご自分で決めてください)

すると、/home/さくらインターネットのアカウント名/www/内と、Laravelプロジェクトの中のpublicフォルダ内が同期されます!

以上で、必要な作業は終了です!

ちなみに、画像アップロード機能などを使用している場合は、laravelプロジェクトに移動した上で以下のコマンドを実行しましょう!

php artisan storage:link

画像のURLをどのようにデータベース上に保存するかによって画像が表示されるURLのルールは変わってきますが、画像が表示される環境下になることは間違いありません!

また、今後Laravelのプロジェクトを更新するには、基本的に以下の作業を行なっていけばOKです!

  • 開発した内容をGitHubに反映
  • さくらインターネットのレンタルサーバに接続してLaravelプロジェクト内に移動した上でgit pullコマンドを実行

まとめ

ここまでの作業を行うことで、「 さくらインターネットのアカウント名.sakura.ne.jp/先ほど指定した任意のフォルダ名」をブラウザのアドレスバー に入力してEnterキーを押すことで、プロジェクトの中身が表示されれば、完璧です!

ここまでご覧いただきありがとうございました!

シェアする

  • このエントリーをはてなブックマークに追加

フォローする