Laravelのsail 開発環境をhttps化

目的

Laravelをsail環境で開発していたところ、OAuthの実装の時にhttpsでcallbackを受ける必要があった。
Laravelはartisan serverで動いているので、https化するにはsailが動いているdockerに別途 nginxを導入する必要があった。
Sail-SSLは初期インストール直後でもhttps://localhostで最低限 https通信ができるので導入が楽。

手段

1. オレオレ認証（localhostやhostsファイルで使うドメイン）で証明書を発行とインストール
2. Sail コンテナでSail-SSLを利用してnginxを導入

sail up -d
sail composer require ryoluo/sail-ssl --dev
sail artisan sail-ssl:install
sail down
sail up -d
sail npm run dev

3.https://localhostへアクセスしてhttps化を確認。

以下はmixed contentエラー対策

1. .envファイルのAPP_URL、ASSET_URLのURLをhttpsに書き換え
2. /etc/nginx/certsを作成して、keyとpem(crt)ファイルを置く
3. nginxの設定ファイルにkeyとpem(crt)ファイルを指定

vendor/ryoluo/sail-ssl/nginx/templates/default.conf.template

ssl_certificate     /etc/nginx/certs/server.pem;
ssl_certificate_key /etc/nginx/certs/server.key;

4.AppServiceProvider.phpにhttps通信を強制

app/Providers/AppServiceProvider.php

    public function boot(): void
    {
        URL::forceScheme('https');
    }

5.vita.config.jsでhttpsを追加、keyとpem(crt)ファイルを指定してvitaの通信もhttps化

vita.config.js

            server: {
                host: true,
                hmr: {
                    host: env.APP_HOST
                },
                https: {
                    key: fs.readFileSync('./server.key'),
                    cert: fs.readFileSync('./server.pem'),

6.再起動

sail down
sail up -d

docker psで443ポートの通信確認、場合によってはオレオレ認証を閲覧PCに読み込ませる。