Outils Développeur
Un ensemble d'utilitaires quotidiens pour développeurs — convertir des couleurs, générer des hachages cryptographiques, travailler avec des timestamps Unix et décoder des JWT.
Tâches rapides
Un clic ouvre l’outil déjà réglé pour la tâche.
Outils pour Développeurs - Couleurs, Hachages, Horodatages et JWT
Voici la catégorie des petites conversions qui interrompent le vrai travail. Une maquette vous donne une couleur HEX et le CSS veut du HSL. Une ligne de log porte un horodatage Unix et vous devez savoir quelle heure il était chez vous. Une API renvoie un jeton et il faut voir ce qu'il contient. Une page de téléchargement publie un SHA-256 et il faut vérifier le fichier. Aucune n'est difficile ; toutes sont pénibles à la main, et les quatre fonctionnent ici sans compte.
Ce que contient cette catégorie
| Outil | Ce qu'il fait | Quand l'utiliser |
|---|---|---|
| Convertisseur de Couleurs | Convertit entre HEX, RGB et HSL | Une palette est dans une notation et votre feuille de style en veut une autre |
| Générateur de Hachage | Calcule MD5, SHA-1, SHA-256 et SHA-512 pour un texte ou un fichier | Vérifier un téléchargement, comparer deux fichiers ou fabriquer une clé de cache |
| Convertisseur d'Horodatage | Convertit les horodatages Unix en dates lisibles et inversement, entre fuseaux | Un log, une colonne de base ou une réponse d'API contient un nombre là où il devrait y avoir une date |
| Décodeur JWT | Découpe un JSON Web Token et affiche son en-tête, sa charge utile et son expiration | Vous déboguez l'authentification et devez voir les revendications |
| Suppression du CSS inutilisé | Ne garde que le CSS qu'une page utilise, à partir d'un export Coverage de Chrome ou du HTML | Un thème ou un constructeur de pages charge bien plus de CSS que la page n'en a besoin |
| Formateur de Code | Embellit ou minifie HTML, CSS, JavaScript et SQL, avec les dialectes SQL et la détection automatique du langage | Un bundle, un modèle ou une requête est arrivé sur une seule ligne illisible, ou un extrait doit être aussi léger que possible |
| Traducteur d'Expressions Cron | Lit une planification cron en langage clair, champ par champ, avec ses prochaines exécutions en heure locale ou en UTC | Une tâche s'exécute à la mauvaise heure, ou vous devez être sûr de ce que fait une ligne crontab avant de la déployer |
| Calculateur de Sous-réseau | Réseau, broadcast, plage d'hôtes, masques et type d'adresse en IPv4 et IPv6, et découpage d'un réseau en sous-réseaux | Vous écrivez une règle de pare-feu, un plan de VPC ou une configuration de routeur, et la plage doit être exacte |
| Analyseur de User Agent | Lit le navigateur, le moteur, l'OS et l'appareil dans n'importe quelle chaîne user agent, et nomme les robots des moteurs de recherche et des IA | Une ligne de log, un rapport d'analytics ou un rapport de bogue montre un user agent que vous devez comprendre |
| JSON vers Types | Transforme un exemple JSON en types TypeScript, Go, Python, C# ou Rust, ou en JSON Schema | Une API renvoie du JSON et votre code a besoin de modèles typés pour le lire |
Notations de couleur, et pourquoi HSL vaut la peine
HEX et RGB décrivent exactement la même chose dans deux écritures : #4F46E5, c'est rgb(79, 70, 229), trois canaux de 0-255 écrits en hexadécimal plutôt qu'en décimal. Convertir de l'un à l'autre est mécanique.
HSL est un modèle véritablement différent, et c'est pour cela qu'il mérite sa place. Il décrit une couleur par sa teinte (position sur la roue chromatique, 0-360), sa saturation (son intensité, 0-100%) et sa luminosité (0-100%). Le gain pratique : assombrir une couleur de 10% pour un état survolé tient en un seul changement de nombre, et construire une palette de nuances apparentées revient à figer teinte et saturation pour parcourir la luminosité. Faire la même chose en HEX suppose de recalculer trois canaux et de deviner.
Le contraste est l'autre raison. Un texte a besoin d'un rapport de contraste d'au moins 4,5:1 avec son fond pour satisfaire WCAG AA en taille normale. La luminosité en HSL prédit bien mieux où vous en êtes que de fixer un code hexadécimal.
Les hachages : à quoi ils servent, et à quoi ils ne servent pas
Une fonction de hachage transforme n'importe quelle entrée en une empreinte de longueur fixe. La même entrée donne toujours la même sortie ; changer un seul caractère en donne une complètement différente ; et on ne peut pas remonter du hachage à l'entrée. Cela fait des hachages le bon outil pour vérifier l'intégrité et le mauvais outil pour stocker des mots de passe.
| Algorithme | Sortie | État |
|---|---|---|
| MD5 | 128 bits | Cassé pour la sécurité. On peut fabriquer des collisions à volonté. Convient comme somme de contrôle non sécuritaire ou clé de cache |
| SHA-1 | 160 bits | Cassé depuis 2017. Encore présent dans d'anciens systèmes et dans les identifiants d'objets Git ; à ne pas choisir pour du neuf |
| SHA-256 | 256 bits | La référence actuelle pour la vérification de fichiers, les signatures et les certificats |
| SHA-512 | 512 bits | Même famille, empreinte plus longue, souvent plus rapide sur du matériel 64 bits |
L'usage quotidien, c'est vérifier un téléchargement : le site publie un SHA-256, vous hachez le fichier reçu avec le générateur de hachage, et les deux chaînes correspondent caractère par caractère, ou non. Cela attrape aussi bien un téléchargement tronqué qu'un miroir altéré.
Ce à quoi les hachages ne servent pas, ce sont les mots de passe. Un simple SHA-256 d'un mot de passe s'attaque à des milliards d'essais par seconde sur du matériel ordinaire. Le stockage de mots de passe exige une fonction lente, salée et conçue pour cela - bcrypt, scrypt ou Argon2 - coûteuse à dessein. Si vous hachez un mot de passe avec quoi que ce soit du tableau ci-dessus, c'est un bogue. Le générateur de hachage a justement un onglet bcrypt pour cela : il crée un hash bcrypt avec le coût que vous choisissez et vérifie un mot de passe par rapport à un hash stocké, et la page bcrypt l'ouvre directement.
Horodatages Unix et confusion des fuseaux
Un horodatage Unix compte les secondes depuis minuit UTC le 1er janvier 1970. Il n'a pas de fuseau horaire, et c'est précisément pour cela que les systèmes l'emploient : c'est un instant sans ambiguïté, et n'importe quel langage sait le convertir en heure locale pour l'affichage. Un nombre à dix chiffres, ce sont des secondes ; un nombre à treize chiffres, des millisecondes - ce que renvoie Date.now() en JavaScript, et une cause très fréquente de dates atterrissant en 1970 ou en l'an 55000.
Le convertisseur d'horodatage fonctionne dans les deux sens et affiche le résultat en UTC à côté de votre heure locale, ce qui est en général la comparaison dont vous avez réellement besoin en lisant un log écrit sur un serveur d'une autre région. Deux dates à connaître : 2147483647 est la dernière seconde que peut contenir un horodatage 32 bits signé, en janvier 2038, et 0 est l'époque elle-même - un horodatage à 0 ou une date au 1er janvier 1970 signifie presque toujours qu'une valeur n'a jamais été renseignée.
Lire un JWT
Un JSON Web Token, ce sont trois segments Base64 compatibles URL séparés par des points : un en-tête indiquant l'algorithme de signature, une charge utile de revendications, et une signature. Le décodeur JWT le découpe et affiche les deux premiers sous forme de JSON lisible, avec exp et iat rendus en dates - ce qui constitue normalement toute la question quand une requête est refusée.
Deux points à poser clairement. Premièrement, la charge utile n'est pas chiffrée. Quiconque détient le jeton peut lire chacune de ses revendications ; un JWT n'est donc pas un endroit pour quoi que ce soit de privé. Deuxièmement, décoder n'est pas vérifier : lire les revendications vous dit ce que le jeton affirme, pas si la signature est valide. Seul le serveur qui détient la clé peut y répondre, et aucun outil de navigateur ne devrait vous demander de coller votre secret de signature pour le savoir.
Comme un jeton est un identifiant vivant tant qu'il est valide, l'endroit où vous le collez compte. Ce décodeur s'exécute entièrement dans votre navigateur : JavaScript analyse le jeton sur votre machine et rien n'est envoyé nulle part, ce que vous pouvez confirmer dans le panneau réseau.
Catégories liées
- Outils d'encodage - sous un JWT il y a du Base64 compatible URL, et le savoir explique la plupart des échecs de décodage.
- Générateurs - engendrent les identifiants et secrets que ces outils inspectent ensuite.
- Outils de texte - formatez le JSON qui sort d'une charge utile décodée.
- Outils d'image - convertissez des ressources pendant que vous avancez sur la même tâche de conception.