環境

混合コンテンツエラーの出力

検証環境へアプリケーションをデプロイしたところ、Chromeのコンソールに混合コンテンツエラーが出力されました。

Mixed Content: The page at xxx.com was loaded over HTTPS, but requested an insecure...

エラーの内容から、httpsとhttpのサイトが混合しており、読み込めないことが原因でした。

Chromeの検証ツールから、cssファイルやJavaScriptファイルへアクセスする際にhttp://localhostへアクセスしており、検証環境のドメインになっていないことがわかりました。

検証環境へドメインするために、コンテンツファイルのURLを環境変数を設定する必要がありました。
.envファイルで環境変数を管理している場合は、下記の記述で設定可能です。

.env

ASSET_URL=https://example.com

無駄にSSL化が適用されていないことや、フロントのビルドツールの設定やオプションに誤りがあるなどを疑ってしまい、解決に時間を費やしてしまいました。。。
今後の自分のためにも忘備録として、記事にさせていただきました。