herokuにLaravelアプリをデプロイする方法 スクショ12枚付で解説

わかりにく過ぎてヤバいのでできるだけ画像付きで解説します。

herokuのアカウントを作ってログイン

この辺はググって。

herokuのサイトでアプリを作成

https://dashboard.heroku.com/apps

より、右上のNew>Create new appをクリック

App nameにアプリ名を半角英数で入力して、Create appボタンを押す。

ほかの人が作ったアプリと重複してはいけない。

かぶったら怒られるので、なんかかぶらなさそうな名前にして。

最終的にアプリのURLに使われる文字列になる。

Heroku Gitを使ったデプロイ方法が表示される。

が、ちょっとまってほしい。

• ローカル環境でherokuコマンドが使えるようにをインストール
• なんかapi key的な奴を発行
• AppServiceProvide.phpを編集
• Procfileの作成
• composer.jsonの編集

などなどやることが盛りだくさん（どこにかいてあるんやろ・・・）

今回は1番左のHeroku Gitのやり方で行う。

真ん中のGithubと連携させるやり方のほうが一見簡単そうに見えるが、今（2022/4現在）は使えなくなっているらしい。

じゃあ書いとけよ！ってかんじ。

実際にやってみたけど無理でした。

開発用PC上でのコマンドラインによるherokuの準備

これはさっきの画面にインストール手順のリンクが貼ってあった。

https://devcenter.heroku.com/articles/heroku-cli

今から解説するので読まなくてもいい。

herokuのインストール

詳しくはリンク先を見てほしいが、macOSにインストールするなら

brew tap heroku/brew && brew install heroku
npm install -g heroku

を叩く。叩く場所はどこでもいいとおもう。

Dockerを使っていてもコンテナの中じゃなくて、mac上でたたいてな！

そのあと

 heroku loginheroku --version

をたたいてて、インストールされていることが確認できればOK↓

heroku --version
heroku/7.60.2 darwin-x64 node-v14.19.0

コマンドライン上でherokuと連携

コマンドライン上からログイン

herokuにプッシュしたいディレクトリまで移動する。

いわゆる、アプリの「プロジェクトディレクトリ」までcdコマンドで行けばいい。

で

heroku login

と叩く。（これもdocker使っていようとコンテナの外）

何かキーを叩け！と英語で表示されるので、「A」とか何でもいいのでキーボードのボタンを押す。

コマンドライン上に、URLが出現するのでクリックなりダブルクリックなりして開く。

すると、ブラウザが立ち上がりherokuにログインするように催される。

ブラウザ上でのログインが完了すると、コマンドラインも次に進む。

自分の環境ではこんな感じの結果になった。

プロジェクトディレクトリ % heroku login
heroku: Press any key to open up the browser to login or q to exit:
Opening browser to https://cli-auth.heroku.com/auth/cli/browser/7e9aa191-7b46-49bd-b260-29267c2d2960?requestor=hogehogehogehoge
Logging in... done
Logged in as hogehoge@gmail.com

herokuと連携

同じくアプリの「プロジェクトディレクトリ」にいる状態で

git init
heroku git:clone -a herokuに設定したアプリ名（本例ではhogehoge11451419）

を叩く。

ブラウザでherokuにadd new appした時の画面に書いてあるコマンドのこと。

このまま続きのコマンドを叩いてコミットとプッシュしてしまいたいところだが、トラップがあるのでちょっと待ってほしい。

キーの設定

キーの発行

キーの登録を行う（しないとNo application encryption key has been specified.のエラーが出る）

アプリケーション上（docker環境ならコンテナの中）で、

php artisan key:generate --show

と叩く。

base64:hogehoge191919191919uwaaaaa

みたいな値が返ってくるので、丸ごとコピーする。

わかりにくいけど先頭の「base64:」も含めてコピーして。

キーの登録

https://dashboard.heroku.com/apps/

にアクセスして、今回作成したアプリを選択する。

Settingタブ＞Config Vars>Recal config Varsボタンを選択

キーが入力できるようになるので、

左側に

APP_KEY

右側にさっきコマンドラインで取得したキー↓（自分のキーに合わせてね）

base64:hogehoge191919191919uwaaaaa

を入力してAddボタンを押す。

アプリのソースコードを編集

まだまだやることがあります。

AppServiceProvide.phpに追記

プロジェクトディレクトリ\app\Providers\AppServiceProvider.php

use Illuminate\Support\Facades\Schema; //追記


public function boot()
{
  Schema::defaultStringLength(191); //追記
}

やらないとデータベースを使うときになんかカラムの文字数オーバーとか言われる。

Procfileの作成

プロジェクトディレクトリ直下にProcfileを言うファイルを追加する

自分の環境だとここに配置した。

（backendっていうのが私のプロジェクトディレクトリ名）

Procfileの内容は下記をコピーして貼り付けて。

web: vendor/bin/heroku-php-apache2 public/

composer.jsonの編集

プロジェクトディレクトリ\composer.json

script:{   }内に

,
        "compile": [
            "@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
        ]

herokuにpushする

コマンドラインの話に戻る。

プロジェクトディレクトリ（docker環境ならコンテナの外）で下記のコマンドを実行。

git commit -am "make it better"
git push heroku master

これでデプロイができたことになる。

今って、masterじゃなくてmainでは？と一瞬思ったが、

それはgithubだけの話っぽい。

heroku上でアプリを確認するには？

同じ場所で次のコマンドを実行。

heroku open

すると、ブラウザが勝手に立ち上がってheroku上のアプリが表示される。

うまくいかない場合

すんなりいかないパターン

No application encryption key has been specified.

Unsupported cipher or incorrect key length. Supported ciphers are: aes-128-cbc, aes-256-cbc, aes-128-gcm, aes-256-gcm.

heroku openコマンドを叩いてもブラウザが起動しない

コマンドを叩いてもサイトに飛べない場合。

これは当てはまる人少ないかもしれないが、

開発環境端末と、操作端末が違うと起こりえる。

例えば、

• WindowsのPCからteratermでMacを操作している
• 別のPCから自宅（または社内）のLinuxサーバーを操作している

などの場合に起きる。

前者の場合、macの画面を見たらブラウザでherokuのアプリケーションが開かれているはず。

後者の場合は試したことがないが、

https;//初めに決めたアプリ名.herokuapp.com

に手元のPCからアクセスしてみて。

例えば本例で行くと

https://hogehoge11451419.herokuapp.com/

となる。

最後に

以上で単純にデプロイする作業は終わり。

mysqlを使いたかったら、クレジットカードを人質に預けて無料プランでを契約する必要がある。

この辺もコツがいるので、需要があればまた書くかも。