User-AgentとBlade.phpを使った表示切り替え

2026年5月29日

はじめに

Webサービスを開発していると、「PCではこの表示にしたい」「スマホではレイアウトを変えたい」といった場面がよくあります。
もちろん最近ではレスポンシブ対応で解決することも多いですが、場合によってはサーバー側で端末を判定し、表示そのものを切り替えたいケースもあります。

Laravel では、User-Agentを利用することでアクセス端末を判定でき、Blade.phpと組み合わせることで柔軟な表示制御が可能になります。
今回は、その基本的な考え方について簡単にまとめたいと思います。

User-Agentとは

User-Agentとは、ブラウザや端末情報をサーバーへ伝えるための文字列です。
例えば、

• iPhoneからのアクセス
• Androidからのアクセス
• ChromeやSafariなどのブラウザ情報

などが含まれています。

Laravel ではリクエストヘッダーから簡単に取得できます。
$userAgent = request()->header('User-Agent');

実際に出力すると、かなり長い文字列が返ってきます。
Mozilla/5.0 (iPhone; CPU iPhone OS 17_0 like Mac OS X) …

Blade.phpで表示を切り替える

User-Agent を利用すると、Blade 側で条件分岐による表示変更ができます。
例えば、スマホかどうかを判定して表示を変えるケースです。

$isMobile = str_contains($userAgent, 'iPhone')
|| str_contains($userAgent, 'Android');

Blade では以下のように使用できます。

@if ($isMobile)
    スマホ用レイアウト
@else 
    PC用レイアウト
@endif

これによって、端末ごとに異なるUIを表示できます。

コントローラーからBladeへ渡す

実際には、Controller 側で判定して Blade に渡すことが多いです。

public function index(Request $request)
{
    $userAgent = $request->header('User-Agent');

    $isMobile = str_contains($userAgent, 'iPhone')
        || str_contains($userAgent, 'Android');

    return view('index', [
        'isMobile' => $isMobile,
    ]);
}

Blade 側：

@if ($isMobile)
    モバイル表示
@else
    PC表示
@endif

ロジックを Blade に直接書きすぎないため、見通しも良くなります。

実務でよくある利用例

実際の開発では、以下のような場面で利用されることがあります。

• スマホ専用バナー表示
• アプリ誘導導線の切り替え
• PC専用UIの非表示
• ダウンロードボタンのOS切り替え
• 一部機能の出し分け

例えば、iPhoneなら App Store、Androidなら Google Play のリンクを表示するといったケースです。

@if ($isIos)
    <a href="#">App Store</a>
@elseif ($isAndroid)
    <a href="#">Google Play</a>
@endif

User-Agent判定の注意点

便利な一方で、User-Agent 判定には注意点もあります。

文字列は端末ごとに異なる

User-Agent は非常に長く、ブラウザやOSアップデートによって変化することがあります。
そのため、単純な文字列判定だけでは漏れが出る可能性があります。

完全な判定は難しい

タブレット判定や特殊ブラウザなど、細かく対応し始めると複雑になります。
そのため、
軽い出し分け → User-Agent
レイアウト調整 → CSSレスポンシブ

というように役割を分けることも重要です。

ライブラリの利用

より正確に判定したい場合は、ライブラリを利用することもあります。
Laravel では jenssegers/agent が有名です。

$agent->isMobile();
$agent->isTablet();
$agent->isDesktop();

のように直感的に判定できるため、実務でも使いやすいライブラリです。

最後に

User-Agent と Blade.php を組み合わせることで、端末ごとに柔軟な表示制御が可能になります。
最近ではレスポンシブデザインが主流ではありますが、サーバー側で出し分けたいケースは今でも少なくありません。
「どこまでをCSSで対応するか」「どこからをサーバー側で制御するか」を考えながら使い分けることが、保守しやすい実装につながると考えています。