Tutoriels
Content Security Policy
Si votre site web utilise Content Security Policy, vous devrez ajouter les mêmes 'nonce-<value>'
et
'strict-dynamic'
à script-src
pour que Tracy fonctionne correctement. Certains add-ons tiers peuvent
nécessiter des configurations supplémentaires. Nonce n'est pas supporté dans la directive style-src
, si vous
utilisez cette directive, vous devez ajouter 'unsafe-inline'
, mais vous devriez éviter cela en mode production.
Exemple de configuration pour Nette Framework :
http:
csp:
script-src: [nonce, strict-dynamic]
Exemple en PHP pur :
$nonce = base64_encode(random_bytes(20));
header("Content-Security-Policy: script-src 'nonce-$nonce' 'strict-dynamic';");
Chargement plus rapide
Le démarrage est simple, cependant, si vous avez des scripts bloquants qui se chargent lentement sur votre page web, ils
peuvent ralentir le chargement de Tracy. La solution est de placer <?php Tracy\Debugger::renderLoader() ?>
dans
votre template avant tous les scripts :
<!DOCTYPE html>
<html>
<head>
<title>...<title>
<?php Tracy\Debugger::renderLoader() ?>
<link rel="stylesheet" href="assets/style.css">
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
Débogage des requêtes AJAX
Tracy intercepte automatiquement les requêtes AJAX créées à l'aide de jQuery ou de l'API native fetch
. Les
requêtes sont affichées dans la barre Tracy comme des lignes supplémentaires, ce qui permet un débogage AJAX facile et
pratique.
Si vous ne souhaitez pas intercepter automatiquement les requêtes AJAX, vous pouvez désactiver cette fonction en définissant la variable JavaScript :
window.TracyAutoRefresh = false;
Pour une surveillance manuelle des requêtes AJAX spécifiques, ajoutez l'en-tête HTTP X-Tracy-Ajax
avec la
valeur retournée par Tracy.getAjaxHeader()
. Voici un exemple d'utilisation avec la fonction
fetch
:
fetch(url, {
headers: {
'X-Requested-With': 'XMLHttpRequest',
'X-Tracy-Ajax': Tracy.getAjaxHeader(),
}
})
Cette approche permet un débogage sélectif des requêtes AJAX.
Stockage de données
Tracy peut afficher des panneaux dans la barre Tracy et des Bluescreens pour les requêtes AJAX et les redirections. Tracy
crée sa propre session, stocke les données dans ses propres fichiers temporaires et utilise le cookie
tracy-session
.
Tracy peut également être configuré pour utiliser la session PHP native, que nous démarrons avant d'activer Tracy :
session_start();
Debugger::setSessionStorage(new Tracy\NativeSession);
Debugger::enable();
Dans le cas où le démarrage de la session nécessite une initialisation plus complexe, vous pouvez démarrer Tracy
immédiatement (afin qu'elle puisse traiter les erreurs éventuelles) puis initialiser le gestionnaire de session et enfin
informer Tracy que la session est prête à être utilisée à l'aide de la fonction dispatch()
:
Debugger::setSessionStorage(new Tracy\NativeSession);
Debugger::enable();
// suit l'initialisation de la session
// et le démarrage de la session
session_start();
Debugger::dispatch();
La fonction setSessionStorage()
existe depuis la version 2.9, avant cela Tracy utilisait toujours la session PHP
native.
Scrubber personnalisé
Le Scrubber est un filtre qui empêche la fuite de données sensibles lors du dump, comme les mots de passe ou les
identifiants. Le filtre est appelé pour chaque élément du tableau ou de l'objet dumpé et retourne true
si la
valeur est sensible. Dans ce cas, *****
est affiché à la place de la valeur.
// empêche l'affichage des valeurs des clés et propriétés comme `password`,
// `password_repeat`, `check_password`, `DATABASE_PASSWORD`, etc.
$scrubber = function(string $key, $value, ?string $class): bool
{
return preg_match('#password#i', $key) && $value !== null;
};
// nous l'utilisons pour tous les dumps à l'intérieur de BlueScreen
Tracy\Debugger::getBlueScreen()->scrubber = $scrubber;
Logger personnalisé
Nous pouvons créer notre propre logger qui journalisera les erreurs, les exceptions non interceptées et sera également
appelé par la méthode Tracy\Debugger::log()
. Le logger implémente l'interface Tracy\ILogger.
use Tracy\ILogger;
class SlackLogger implements ILogger
{
public function log($value, $priority = ILogger::INFO)
{
// envoie une requête à Slack
}
}
Et ensuite nous l'activons :
Tracy\Debugger::setLogger(new SlackLogger);
Si nous utilisons le framework Nette complet, vous pouvez le configurer dans le fichier de configuration NEON :
services:
tracy.logger: SlackLogger
Intégration de Monolog
Le paquet Tracy fournit un adaptateur PSR-3 qui permet l'intégration de monolog/monolog.
$monolog = new Monolog\Logger('main-channel');
$monolog->pushHandler(new Monolog\Handler\StreamHandler($logFilePath, Monolog\Logger::DEBUG));
$tracyLogger = new Tracy\Bridges\Psr\PsrToTracyLoggerAdapter($monolog);
Debugger::setLogger($tracyLogger);
Debugger::enable();
Debugger::log('info'); // écrit : [<TIMESTAMP>] main-channel.INFO: info [] []
Debugger::log('warning', Debugger::WARNING); // écrit : [<TIMESTAMP>] main-channel.WARNING: warning [] []
nginx
Si Tracy ne fonctionne pas sur votre serveur nginx, il est probablement mal configuré. S'il y a quelque chose comme ceci dans la configuration :
try_files $uri $uri/ /index.php;
modifiez-le en :
try_files $uri $uri/ /index.php$is_args$args;