CakePHP4のデバッグツールバーの表示方法

CakePHP4のデバッグツールバーの表示方法
(CakePHP3も一緒なのかな??)

サーバーにアップしたところ、ツールバーが表示されなくなっていたので、その解決方法

まずはマニュアル通り設定をしていきます。

/config/bootstrap.php

下記のようなdebugの設定があります。

if (Configure::read('debug')) {
	Configure::write('Cache._cake_model_.duration', '+2 minutes');
	Configure::write('Cache._cake_core_.duration', '+2 minutes');
	// disable router cache during development
	Configure::write('Cache._cake_routes_.duration', '+2 seconds');

	/** ここに追加します **/
}

「/** ここに追加します **/」に下記の2行を追加します。

// デバッグツールバーの表示
Configure::write('DebugKit.panels', ['DebugKit.Packages' => true]);
Configure::write('DebugKit.safeTld', ['jp']);# jpドメインの表示を許可する

2行目のDebugKit.safeTldの値にご自身のドメインを指定します。

これでデバッグツールバーが画面の右下に表示されると思いますが、
それでも表示されない場合は強制的に表示させる設定を追加してみます。

Configure::write('DebugKit.forceEnable', true);

私の場合これでも表示されませんでした。
ソースを確認するとデバッグツールのタグを出力されていました。
コンソールを確認してみると下記のエラーメッセージが表示されてました。

toolbar.js?1678925804:54 Mixed Content:
The page at ‘https://xxxxxxxxxx.jp’ was loaded over HTTPS,
but requested an insecure frame ‘http://xxxxxxxxxx.jp/debug-kit/toolbar/xxxxx-xxxxx-xxxxx’.
This request has been blocked; the content must be served over HTTPS.

SSLじゃないのでブロックしたと。

この情報をもとに検索
下記の修正案がありました。

参考
https://github.com/cakephp/debug_kit/issues/736

上記の記事を参考に修正していきます。

vendor/cakephp/debug_kit/src/ToolbarService.php

public function injectScripts($row, ResponseInterface $response)
{
...
        $url = Router::url('/', true);
+        if (isset($_SERVER['HTTPS']) || isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWARDED_PROTO'] == 'https') {
+            $url = str_replace('http', 'https', $url);
+        }

※「+」が追加する行

vendor/cakephp/debug_kit/templates/Requests/view.php

<?php $this->Html->script('DebugKit./js/debug_kit', [
    'block' => true,
    'id' => '__debug_kit_app',
    'data-id' => $toolbar->id,
-    'data-url' => Router::url('/', true),
+    'data-url' => checkHttps(Router::url('/', true)),
    'data-webroot' => $this->request->getAttribute("webroot"),
]) ?>
+<?php
+function checkHttps($url) {
+    if (isset($_SERVER['HTTPS']) || isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWARDED_PROTO'] == 'https') {
+        $url = str_replace('http', 'https', $url);
+    }
+    return $url;
+}
?>

※「+」が追加する行 「-」は削除する行

これで自ドメインがSSLならSSLでデバッグツールのURLを発行してくれます。