富山のシステム開発・Web制作会社

Laravel TelescopeとTelescope Toolbarで効率よくデバッグする

私は元々PHPのフレームワークとしてはSymfonyを使っていたのですが、その際に標準でついていたデバッグツールであるProfilerが非常に便利で、同じものがLaravelにも無いか探していました。
Symfony Profilerはコントローラーで実行した処理のタイムラインやクエリのログ、フォームのバリデーション結果などを表示できるツールです。
全く同じではありませんが、同様のことがLaravel TelescopeLaravel Telescope Toolbarを組み合わせることで実現できたのでご紹介します。

Laravel Telescopeについて

Laravel Telescopeはリクエストの履歴を詳細に確認できたり、コマンドやジョブ、メールのログが確認できたりなど、幅広いデバッグ情報が閲覧できます。
Symfony Profilerのように処理のタイムラインやバリデーションなどが確認できないのは残念ですが、ほとんどのケースで十分な情報が得られると思います。

laravel-telescope

Laravel Telescope Toolbarについて

Laravel Telescope Toolbarは、Laravel Telescopeの情報をページの一番下に表示するためのライブラリです。
通常、Laravel Telescopeは開いたページとは別のタブで開いておき、リクエストの一覧などから目的の情報を探して表示するような使い方です。
しかしセッションの内容確認や実行したクエリ一覧など、すぐに見たい情報を別タブで確認するのは面倒なので、その不便さを解消するためにLaravel Telescope Toolbarを使います。

なお同様のツールでLaravel Debugbarがありますが、Laravel TelescopeとLaravel Telescope Toolbarの組み合わせのほうが得られる情報が多くてデバッグしやすいと感じます。

Laravel Telescopeのインストール

公式のインストール手順の通りです。


composer require laravel/telescope
php artisan telescope:install
php artisan migrate

Laravel Telescope Toolbarのインストール

公式のインストール手順の通りです。


composer require fruitcake/laravel-telescope-toolbar --dev

ツールバーを確認する

いずれかのページをブラウザで開くとページ下部にLaravel Telescope Toolbarが表示されます。
表示されているアイコンにカーソルを乗せると情報が閲覧できます。

laravel-telescope

セッションの情報や…

laravel-telescope

実行したクエリ情報も確認できます。

laravel-telescope

また、リクエスト毎にTelescope画面のリンクも表示されるため、JavaScriptからAPIを呼び出した際などのデバッグもやりやすいです。

laravel-telescope

右下のアイコンをクリックすると、ツールバーを隠すこともできます。

laravel-telescope

Laravel Telescopeのデータ削除を組み込む

Laravel Telescopeはデバッグ用のデータをデータベースに保管しています。
知らぬ間に大量のデータを保存することになってしまうため、不要になった過去データを自動で削除する機能をスケジュール登録することをおすすめします。
登録方法は公式ドキュメントの通りです。

「app/Console/Kernel.php」に次のいずれかを追記します。


// 24時間より古いデータを削除
$schedule->command('telescope:prune')->daily();
// 48時間より古いデータを削除
$schedule->command('telescope:prune --hours=48')->daily();

まとめ

Laravel TelescopeとLaravel Telescope Toolbarについてご紹介しました。
ツールバーがあることでログインしているユーザーが誰か一目でわかったり、意図せず大量のクエリを実行していることに気づけたりするので、何気なく目に入ってくる情報が増えて便利です。
Laravel Telescopeにはここで紹介した以外にもキャッシュ情報やログの表示機能なども備わっているので、導入した際は確認いただければと思います。

この記事を書いた人
Chief Technology Officer

よく読まれている記事

iOS16.4のWebプッシュ通知を試す

Laravel Sailで開発環境を構築する

【jQuery】アクセスごとに動画とポスター画像をランダム表示させる方法

iPhoneのSafariでデバッグする方法

TensorFlow Lite Model Makerでカスタムモデルを作成する

LaravelとBackpackで構築した管理画面をカスタマイズする

【CSS】コンテンツ量が少ない時だけフッターを下部に固定する方法

LaravelとBackpackで管理画面を爆速で構築する

アクセス数バク上がり!MARBLEのアクセス数増加方法を大公開!

Flutter SDKのバージョンをプロジェクト別に指定する

関連記事

Laravel Sailで開発環境を構築する

LaravelとBackpackで構築した管理画面をカスタマイズする

LaravelとBackpackで管理画面を爆速で構築する