◀ 15.

url との違いと CDN 設定

▶

編集

この記事の要点

asset('css/app.css') は public/ 配下のファイルへの完全 URL を返す（例: http://example.com/css/app.css）
ベース URL は config/app.php の url（APP_URL）。サブドメイン / CDN 配信は ASSET_URL でも上書き可
HTTPS 強制は secure_asset()。または AppServiceProvider で URL::forceScheme('https')
キャッシュバスティングが必要なら mix()（Laravel Mix）か vite()（Vite）を使う — ファイルにハッシュ付き URL を生成
url() はアプリケーション URL（ルート向け）、asset() は静的ファイル向け、と用途が違う

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()。

編集

子ページ

子ページはありません

同階層のページ

2026-05-17 05:58:48 guest 638

最近更新/作成されたページ

Laravel キャッシュクリア完全ガイド（cache:clear / config:clear / 2026-05-18 07:42:07
プロジェクトの作成と削除 2026-05-18 07:42:07
インストール直後にNetbeansが反応しない 2026-05-18 07:42:07
動画やチャンネルの検索 2026-05-18 07:42:07
APIキー取得方法 2026-05-18 07:42:07
チャンネル情報の取得 2026-05-18 07:42:07
API 入門 — Web API（REST / GraphQL / gRPC / 2026-05-18 07:42:07
インストール(eclipseプラグイン) 2026-05-18 07:42:07
Laravel「Dotenv values containing spaces must be surrounded 2026-05-18 07:42:07
エラー一覧 2026-05-18 07:42:07
curl: (51) SSL: certificate subject name '～' does not match 2026-05-18 07:42:07
インストール方法(Windows版) 2026-05-18 07:42:07
JSONから配列に変換 2026-05-18 07:42:07
処理を一定時間待つ 2026-05-18 07:42:07
A non well formed numeric value encountered 2026-05-18 07:42:07

ページ一覧

その他