タイトル: assetヘルパーを利用したpublicフォルダへのアクセス
SEOタイトル: Laravel asset() ヘルパー徹底解説 — mix / vite / url との違いと CDN 設定
| この記事の要点 |
|
asset() の基本
asset() は public/ ディレクトリ内のファイルへの URL を生成するヘルパー関数です。Blade テンプレートで CSS / JS / 画像を読み込むときの定番です。
{{-- 例: APP_URL=http://example.com の場合 --}}
{{-- → http://example.com/css/app.css --}}
{{-- → http://example.com/js/app.js --}}
{{-- → http://example.com/images/logo.png --}}
ファイル配置の前提
プロジェクトルート/
├── app/
├── public/ ← Web 公開ルート(DocumentRoot)
│ ├── index.php
│ ├── favicon.ico
│ ├── css/
│ │ └── app.css ← asset('css/app.css') で参照
│ ├── js/
│ │ └── app.js
│ └── images/
│ └── logo.png
├── resources/ ← 元ソース。Mix/Vite でビルドして public/ へ
└── ...
URL の組み立てロジック
asset() が返す URL は次の優先順位で決まります:
config('app.asset_url')(ASSET_URL環境変数)— CDN 等を別ホストにしたい場合config('app.url')(APP_URL環境変数)- リクエストの
scheme://host
// 内部実装イメージ (簡略)
function asset(string $path, ?bool $secure = null): string
{
return app('url')->asset($path, $secure);
}
// .env 例
APP_URL=https://example.com
ASSET_URL=https://cdn.example.com // ← 設定すると asset() がこちらを優先
secure_asset() による HTTPS 強制
{{-- 常に https:// で出力したい --}}
{{-- 第 2 引数で個別指定も可 --}}
本番環境では AppServiceProvider::boot() で一括強制するのが楽です:
use Illuminate\Support\Facades\URL;
public function boot()
{
if ($this->app->environment('production')) {
URL::forceScheme('https');
}
}
asset / url / route の違い
| ヘルパー | 用途 | 出力例 |
|---|---|---|
asset('css/app.css') | 静的ファイル(public/) | https://example.com/css/app.css |
url('/users') | アプリの任意 URL | https://example.com/users |
route('users.show', 1) | 名前付きルート | https://example.com/users/1 |
action([UserController::class, 'show'], 1) | コントローラから生成 | https://example.com/users/1 |
キャッシュバスティングが必要な場面
asset('css/app.css') はそのまま /css/app.css を出力するため、ブラウザがキャッシュした古い CSS を読み続ける問題が起きます。デプロイのたびに新しい URL にしたい場合は Mix / Vite を使います。
{{-- Laravel Mix (mix-manifest.json を参照) --}}
{{-- → /css/app.css?id=8a1b3c... のようにハッシュ付き --}}
{{-- Vite (Laravel 9.19+) --}}
@vite(['resources/css/app.css', 'resources/js/app.js'])
{{-- →
--}}
CDN 配信のための ASSET_URL 設定
# .env で別ホストを指定
APP_URL=https://example.com
ASSET_URL=https://d1xxxxxx.cloudfront.net
# Blade での出力結果
# asset('images/logo.png')
# → https://d1xxxxxx.cloudfront.net/images/logo.png
# url('/users') はアプリ側 (example.com) のまま
# → https://example.com/users
よくあるトラブル
| 症状 | 原因 / 対処 |
|---|---|
| 本番で http:// になる | APP_URL が https:// になっていない、または URL::forceScheme('https') 未設定 |
ローカルでドメインが localhost 以外になる | APP_URL を上書き。config:clear 必須 |
| サブディレクトリで動かしたら 404 | APP_URL に /myapp を含める。例: https://example.com/myapp |
| storage/app/public が見えない | php artisan storage:link でシンボリックリンク作成 |
storage と asset の連携
# storage/app/public → public/storage のシンボリックリンクを張る
php artisan storage:link{{-- アップロード画像を表示 --}}
{{-- または Storage ファサード --}}
 }})
FAQ
Q: asset() の出力をすべて HTTPS にしたい
A: APP_URL=https://... に加え、AppServiceProvider で URL::forceScheme('https')。リバプロ配下なら TrustProxies ミドルウェアも設定。
Q: バージョン文字列を付けたい(?v=1.2)
A: 簡易にやるなら asset('css/app.css') . '?v=' . config('app.version')。本格的には Mix / Vite を使用。
Q: 画像 URL を Blade 内で組み立てるベストプラクティス
A: アップロード画像なら Storage::url()、固定アセットなら asset()、CDN 経由なら ASSET_URL + asset()。