Command Palette

Search for a command to run...

Regex Builder : testez visuellement les expressions régulières (avec une feuille de triche)

Regex Builder : testez visuellement les expressions régulières (avec une feuille de triche)

T
Toolz Team
|Jul 1, 2026|17 min read

J'ai une confession qui fera grincer des puristes de Regex : pendant les premières années de ma carrière, j'ai écrit des expressions régulières en copiant un collage de Stack Overflow, en changeant un caractère, en exécutant le code, en le voyant échouer et en répétant jusqu'à ce que cela fonctionne. Je n'ai pas compris les modèles - je les ai intimidés dans la soumission. C'était lent et pire, les modèles que j'ai expédiés étaient fragiles d'une manière que je ne pouvais pas voir.

Ce qui a corrigé cela, n'était pas la lecture de la théorie (bien que j'aie finalement fait). C'était un testeur visuel - une boîte où je tapais le motif, une boîte où je colle les chaînes de test et correspond à cela éclairant l'instant où je change quelque chose. Soudain, j'ai pu examiner pourquoi \d+ J'ai attrapé plus que je ne le voulais, ou pourquoi mon modèle d'e-mail a rejeté une adresse parfaitement valide. Regex a cessé d'être un jeu de devinettes et est devenu une boucle de rétroaction étroite.

C'est exactement ce que Regex Builder sur toolz.dev est. Vous écrivez un modèle, vous insérez des données de test, basculez des drapeaux et regardez les matchs et les groupes capturés en temps réel. Il s'exécute entièrement dans votre navigateur, de sorte que les lignes de journal ou les données utilisateur sur lesquelles vous testez ne sont jamais téléchargées nulle part. Ce guide est la référence regex que j'aurais aimé avoir à l'époque - les modèles que je réutilise réellement, une feuille de triche complète et la seule erreur qui peut supprimer un serveur de production.

tl;dr : Collez votre modèle et testez des chaînes dans le Regex Builder et basculer le g/i/m Les drapeaux pour voir les matchs en surbrillance en direct. Commencez simplement, ajoutez des contraintes pour tuer les faux positifs et testez les entrées adversaires pour éviter les retours en arrière catastrophiques. Pour les données extraites, associez-les à Formateur JSON et Convertisseur de base64. Tout côté client, tout est gratuit.


Qu'est-ce qu'une expression régulière ?

Une expression régulière — regex ou regexp — est une chaîne compacte qui décrit un modèle de recherche. Au lieu de "Trouvez le mot cat", vous pouvez dire "Trouvez n'importe quel nombre à cinq chiffres", "Trouvez tout ce qui ressemble à un e-mail", ou "trouver chaque ligne qui commence par une erreur". Presque tous les langages et tous les éditeurs les prennent en charge, ce qui rend la compétence si portable : apprenez-la une fois et vous l'utilisez en JavaScript, Python, votre grep, et votre idée est de trouver et de remplacer.

Le concept est issu de la théorie du langage formel des années 1950, et Ken Thompson l'a intégré à l'informatique dans les années 1960 pour l'édition de texte. Cette histoire compte pour une raison pratique, je reviendrai à : "régulier" Les langues ont des limites, c'est pourquoi Regex ne peut vraiment pas analyser les structures imbriquées comme du HTML, peu importe la façon dont vous devenez intelligent.

Où j'obtiens la regex dans une semaine normale : validation de la saisie de l'utilisateur avant qu'elle ne parvienne à la base de données, extraire des champs des lignes de journal non structurées, faire la recherche et le remplacer dans une base de code entière qu'une simple recherche ne peut exprimer et filtrer des données lors d'une migration. le Regex Builder C'est là que je prototype chacun de ceux-ci avant qu'il ne soit presque réel.

Voici les éléments fondamentaux de l'alphabet, à partir desquels vous assemblez des modèles :

syntaxe éloquent exemple allumette
. N'importe quel personnage sauf la nouvelle ligne h.t chapeau, chaud, coup
\d N'importe quel chiffre (0-9) \d{3} 123, 456
\w Mot char (A-Z, A-Z, 0-9, _) \w+ Bonjour, test_123
\s N'importe quel espace blanc hello\sworld Bonjour le monde
^ Début de chaîne ^Hello Bonjour au début
$ Fin de chaîne end$ Fin à la fin
* zéro ou plus ab*c AC, ABC, ABBC
+ un ou plusieurs ab+c ABC, ABBC
? zéro ou un colou?r Couleur, couleur
{n} exactement n fois \d{4} 2026
{n,m} entre n et m \d{2,4} 12, 123, 1234
[abc] Classe de personnages [aeiou] N'importe quelle voyelle
[^abc] Classe rejetée [^0-9] Tout non-chiffre
(...) Capturer un groupe (hello) Captures "bonjour" ;
a|b Alternance (ou) cat|dog Chat ou chien

Quels modèles de regex chaque développeur devrait-il garder à portée de main ?

Ce sont ceux que j'ai testés, cassés, réparés et maintenant conservés dans un fichier d'extraits personnels. copiez-les directement dans le Regex Builder Et jetez-leur vos propres étuis de bord.

Courriel (le genre pratique)

^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$

Cela correspond [email protected] et [email protected], et rejette @example.com ou user@com. Voici l'honnêteté importante, cependant : la grammaire complète des e-mails dans RFC 5322 est monstrueusement complexe - il autorise techniquement les chaînes et les commentaires entre guillemets que presque personne n'utilise. Ne chassez pas la conformité à 100 % RFC avec un regex. Faites correspondre les 99 % pratiques avec le modèle ci-dessus, puis confirmez que l'adresse est réelle en envoyant un e-mail de vérification. C'est l'erreur que je vois le plus : les équipes qui brûlent des jours sur une " herméticité à l'air" par e-mail à la regex qui ne peut toujours pas dire une vraie boîte de réception à partir d'une faute de frappe.

ouverture

^https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$

allumette https://toolz.dev et http://www.example.com/path?query=value; rejette ftp://... et du texte brut.

Numéro de téléphone américain

^(\+1)?[-.\s]?\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$

Assez flexible pour 555-123-4567, (555) 123-4567, +1 555.123.4567, et 5551234567.

Adresse IPv4

^((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$

L'alternance imbriquée est ce qui impose que chaque octet reste entre 0 et 255, de sorte qu'il rejette correctement 999.999.999.999.

Vérification de mot de passe forte

^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$

Nécessite au moins 8 caractères avec une minuscule, une majuscule, un chiffre et un symbole. le (?=...) Les sommiers affirment chacun une condition sans consommer de caractères, une astuce intéressante qui vaut la peine d'être comprise.

Date ISO (AAAA-MM-JJ)

^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$

allumette 2026-07-11, rejette 2026-13-01 et 2026-02-32.

couleur hexagonale

^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$

allumette #4466EE, #abc, #000000.


La feuille de triche Regex

Gardez ceci épinglé. C'est la référence que je vérifie le plus.

mouillage

habitude description
^ Début de chaîne (ou ligne en mode multiligne)
$ Fin de chaîne (ou ligne en mode multiligne)
\b Limite de mots
\B Limite de non-mot

quantificateurs

habitude description
* 0 ou plus (avide)
+ 1 ou plus (gourmand)
? 0 ou 1 (gourmand)
*? +? ?? Versions paresseuses - correspondent le moins possible
{n} {n,} {n,m} Exactement n / n ou plus / entre n et m

Classes de personnages

habitude description
[abc] a, b ou c
[^abc] Pas A, B ou C
[a-z] [A-Z] [0-9] gammes
\d \D Chiffre / Non-chiffre
\w \W Mot char / non-mot
\s \S Espaces blancs / non-blancs

Groupes et recherches

habitude description
(abc) Groupe de capture
(?:abc) Groupe non capturé
(?<name>abc) Groupe de capture nommé
(?=abc) / (?!abc) Avis de regard positif / négatif
(?<=abc) / (?<!abc) Aspect positif / négatif derrière

drapeaux

drapeau description
g Global — Rechercher tous les correspondances
i insensible aux casses de la casse
m Multiligne — ^ et $ correspondre aux limites de la ligne
s dotall — . Correspond aux newlines
u Prise en charge Unicode

Comment construire et déboguer un modèle sans perdre une heure ?

Mon processus est ennuyeux exprès, car le forage est répétable :

  1. Commencez par la chose la plus simple qui correspond à un exemple réel. N'essayez pas de gérer chaque cas à la fois.
  2. Collez les chaînes de test positives et négatives dans le Regex Builder — Choses qui doivent correspondre et les choses qui ne doivent pas.
  3. Serrer pour tuer les faux positifs. Ajouter des ancres (^, $) Ainsi, le motif correspond à la chaîne entière et échangez . Pour des classes spécifiques comme [a-z] ou [^,].
  4. Lancer une entrée contradictoire — Chaînes vides, entrées énormes, Unicode et caractères de regex littéraux en tant que données.
  5. Alors seulement optimisez.

Quand quelque chose se comporte mal, c'est presque toujours l'une des trois choses. si c'est correspond trop, vos quantificateurs sont gourmands - les rendre paresseux (*?) ou vos cours plus spécifiques. si c'est correspond trop peu, vous avez probablement besoin de i Indiquer ou oublié d'échapper à un caractère spécial. si c'est Ne correspond à rien du tout, recherchez les métacaractères non échappés (., *, +, (, [, {, etc.) censés être des caractères littéraux ou invisibles comme des onglets cachés dans votre chaîne de test.


Qu'est-ce que le retour en arrière catastrophique et pourquoi devriez-vous le craindre ?

C'est la section que je tatoue sur les nouveaux développeurs si je le pouvais. Au début, j'ai livré une regex de validation d'entrée qui semblait complètement innocente, et un après-midi, une seule demande a fixé un cœur de processeur à 100 % et y est resté. Le modèle était le problème.

Lorsqu'un moteur Regex ne trouve pas de correspondance, il Arrière-plans — Il recule et essaie d'autres moyens de satisfaire le modèle. Certaines formes font exploser le nombre de chemins de façon exponentielle. L'exemple du manuel :

^(a+)+$

alimenter qu'une entrée comme aaaaaaaaaaaaaaaaaaaab (une série de a se terminant par un b), et les quantificateurs imbriqués donnent au moteur un nombre astronomique de façons de diviser le aS, tout ce qu'il essaie avant de conclure "pas de match". Votre application se fige. Il s'agit d'une véritable classe de déni de service appelée reboiser (Denin de service d'expression régulière), et les attaquants l'exploitent.

Comment rester en sécurité :

  1. Ne jamais nichoir quantitatif. (a+)+, (a*)*, et (a+)* sont des drapeaux rouges.
  2. Utilisez des groupes atomiques ou des quantificateurs possessifs Où le moteur les supporte : (?>a+) ou a++.
  3. Soyez précis. [a-z]+ arrière-plans inférieur à .+ Parce qu'il a moins de chemins à explorer.
  4. Ancrez vos modèles Ainsi, le moteur échoue rapidement sur une entrée non correspondante.
  5. Testez avec des chaînes qui correspondent presque mais échouent à la toute fin — C'est le pire des cas de retour en arrière.

Si vous êtes en déplacement, ce problème n'existe tout simplement pas, ce qui m'amène à la section suivante.


En quoi la regex diffère-t-elle d'une langue à l'

La syntaxe de base se déplace bien, mais les détails piquent. Ce sont les différences que j'ai trébuchées.

Javascript :

const regex = /\d{3}-\d{4}/g;
const pattern = new RegExp('\\d{3}-\\d{4}', 'g'); // note the doubled backslashes
'555-1234'.match(regex);              // ["555-1234"]
const m = '2026-07-11'.match(/(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/);
m.groups.year;                        // "2026"

Attention : LookBehind n'est arrivé qu'en ES2018, \d correspond aux chiffres ASCII uniquement et le g Le drapeau fait .test() étatique via lastIndex — Une source de bogues subtile dans les boucles.

Python :

import re
pattern = re.compile(r'\d{3}-\d{4}')      # raw strings avoid double-escaping
pattern.findall('Call 555-1234 or 555-5678')  # ['555-1234', '555-5678']

Utilisez toujours des chaînes brutes (r'...'). ne pas oublier re.match Seuls les ancres au départ — Utilisation re.search à trouver n'importe où. et re.VERBOSE Vous permet d'écrire des modèles commentés à plusieurs lignes, ce qui est une bouée de sauvetage pour les modèles complexes.

php : Les modèles ont besoin de délimiteurs ('/\d{3}-\d{4}/'), il utilise le puissant moteur PCRE, et preg_match retours 1, 0, ou false En cas d'erreur - vérifiez donc avec ===.

Allez : Utilise le moteur RE2, qui délibérément Lancers de vue, regards derrière et références de retour En échange d'une garantie de correspondance temporelle linéaire. Cela signifie qu'aucune marche arrière n'est possible, un compromis véritablement différent à savoir lorsque vous choisissez une langue pour la correspondance d'entrées non fiables.


Un exemple réel : analyser une ligne de journal Apache

Voici le genre de chose pour laquelle Regex est vraiment génial. Une ligne de journal d'accès Apache standard ressemble à :

192.168.1.1 - frank [11/Jul/2026:10:27:10 -0500] "GET /api/users HTTP/1.1" 200 1234

Ce modèle le sépare :

^(\S+) \S+ (\S+) \[([^\]]+)\] "(\S+) (\S+) (\S+)" (\d{3}) (\d+)$

Collez les deux dans le Regex Builder Et chaque groupe capturé s'allume séparément :

groupement contentement exemple
1 adresse IP 192.168.1.1
2 nom d'utilisateur franc
3 horodatage 11/juil/2026:10:27:10 -0500
4 Méthode HTTP obtenir
5 Chemin de demande /API/Utilisateurs
6 Version HTTP http/1.1
7 code d'état 200
8 Taille de la réponse 1234

Une fois que les groupes s'alignent dans le testeur, le traduisant en un re.findall en python ou un match() En JavaScript est trivial, et vous savez déjà que cela fonctionne.


Questions fréquentes

Qu'est-ce qu'un constructeur de regex ?

Un Regex Builder est un outil interactif où vous tapez une expression régulière et que vous la voyez immédiatement correspondre aux chaînes de test, avec des correspondances et des groupes capturés. Il remplace la boucle lente écriture-run-fail-réécriture dans votre code par une boucle en direct. le Regex Builder Sur Toolz.dev le fait entièrement dans votre navigateur, de sorte que les données de test restent sur votre machine.

Les modèles de regex sont-ils identiques dans tous les langages de programmation ?

La syntaxe de base est presque identique, mais les détails diffèrent suffisamment pour provoquer des bogues. JavaScript plus ancien manquait de lookbehind, le moteur RE2 de Go n'a aucun antécédent ou références de retour, et les groupes de noms Python avec (?P<name>...) dans certains contextes. Confirmez toujours un modèle dans la langue que vous ciblez plutôt que de supposer la portabilité.

Comment valider une adresse e-mail avec Regex ?

Utilisez un modèle pratique comme ^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$, qui gère la grande majorité des adresses réelles. Ne tentez pas la conformité RFC 5322 complète dans un regex - la grammaire est beaucoup trop complexe et vous rejetterez toujours des adresses valides ou accepterez les fautes de frappe. Associez la regex à un e-mail de vérification pour confirmer que la boîte de réception existe réellement.

Pourquoi mon regex gèle-t-il l'application ?

Recul catastrophique presque toujours. Les modèles avec des quantificateurs imbriqués comme (a+)+ Créez un nombre exponentiel de chemins correspondants lorsqu'ils rencontrent des entrées qui correspondent presque mais échouent finalement, et le moteur les essaie tous. Supprimez les quantificateurs imbriqués, préférez des classes de caractères spécifiques .+, et ajoutez des ancres pour que le moteur puisse tomber rapidement en panne.

Puis-je utiliser Regex pour analyser HTML ou JSON ?

Non, pas pour autre chose que l'extraction triviale. HTML et JSON ne sont pas des langages réguliers - ils permettent une imbrication arbitraire que Regex ne peut fondamentalement pas suivre. Utilisez un véritable analyseur : DomParser ou Cheerio pour HTML, et JSON.parse ou un outil JSON pour JSON. Regex est le mauvais outil au moment où la structure est nichée.

Quelle est la différence entre l'appariement gourmand et paresseux ?

Quantificateurs gourmands (*, +, ?) Saisissez autant que possible et faites marche arrière si nécessaire;*?, +?, ??) Saisissez le moins possible et ne développez que si cela est forcé. en vue de <b>bold</b>, gourmand <.*> Avale toute la ficelle en paresseux <.*?> s'arrête au premier <b>. Choisir le bon est souvent la solution lorsqu'un modèle correspond trop.

Comment échapper aux caractères spéciaux dans la regex ?

Mettez une barre oblique inverse devant n'importe quel métacaractère que vous voulez dire littéralement : \., \*, \+, \?, \(, \), \[, \], \{, \}, \^, \$, \|, et \\. La plupart des langues offrent également une aide pour échapper à une chaîne entière pour vous. re.escape() En Python, par exemple, ce qui est plus sûr que de s'échapper à la main lorsque la chaîne vient de l'entrée de l'utilisateur.

Que signifient les drapeaux regex g, i et m?

g (Global) trouve chaque match au lieu de s'arrêter au premier, i (Ignorer le cas) rend le modèle insensible à la casse, et m (multilin) fait ^ et $ Correspondre à chaque saut de ligne plutôt que seulement le début et la fin de la chaîne. Ils se combinent librement, donc gim fait les trois. Un gotcha fréquent en JavaScript : réutiliser un g Regex à travers les appels lastIndex entre eux, ce qui fait test() Alterner vrai et faux — recréer le modèle ou réinitialiser lastIndex.

Qu'est-ce qu'un aperçu dans la regex ?

Un sommier affirme que quelque chose ne suit pas ou ne suit pas, sans le consommer. foo(?=bar) allumette foo seulement quand bar vient ensuite ; foo(?!bar) Correspond uniquement quand ce n'est pas le cas. regarde derrière ((?<=...), (?<!...)) fait la même chose à l'envers et a atterri en JavaScript, Python et PCRE modernes - mais pas dans GO&#39;s RE2, qui rejette carrément les deux. Les règles de mot de passe sont l'utilisation classique : ^(?=.*\d)(?=.*[a-z]).{8,}$ Les assertions de piles afin que chaque exigence soit vérifiée indépendamment au même poste.

Comment jumeler un numéro de téléphone avec regex ?

Pour un format spécifique, soyez explicite plutôt qu'intelligent : ^\(\d{3}\) \d{3}-\d{4}$ allumette (555) 123-4567. Pour tolérer divers séparateurs, autorisez les séparateurs optionnels comme ^\+?1?[-.\s]?\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$. La numérotation des téléphones est compliquée d'un pays à l'autre, alors ne validez que le format que vous acceptez et normalisez en chiffres avant de le stocker - créez et testez le modèle en direct avant de lui faire confiance.


arrivée

Regex est passé de ma compétence la plus redoutée à l'une des plus utilisées au moment où j'ai commencé à créer des modèles dans un testeur en direct au lieu de deviner dans mon éditeur. Commencez simplement, testez les entrées réelles et contradictoires, respectez le retour en arrière catastrophique et conservez une bibliothèque personnelle de modèles auxquels vous faites confiance.

le Regex Builder Sur Toolz.dev rend cette boucle rapide, avec la correspondance en temps réel, la mise en évidence de groupe et les bascules de drapeaux, le tout s'exécute dans votre navigateur afin que vos données de test restent privées. Lorsque votre modèle extrait JSON, remettez-le à la Formateur JSON, lorsqu'il capture une blob Base64, décodez-la avec le Convertisseur de base64. Ou parcourez les 600 + outils gratuits sur toolz.dev.

Frequently Asked Questions

A regex builder is an interactive tool where you type a regular expression and immediately see it matched against test strings, with matches and captured groups highlighted. It replaces the slow write-run-fail-rewrite loop in your code with a live one. The Regex Builder on toolz.dev does this entirely in your browser, so test data stays on your machine.

Comments

0 comments

0/2000 characters

No comments yet. Be the first to share your thoughts!