Головна » Кодування » 30 Корисні фрагменти коду Regex для веб-розробників

    30 Корисні фрагменти коду Regex для веб-розробників

    Регулярні вирази є потужним інструментом, який має бути в кожному поясі інструменту розробника. Вони можуть збігатися з рядком символів на основі дуже складних параметрів, що може заощадити багато часу при створенні динамічних веб-сайтів.

    Веб-розробники стикаються з різними завданнями, ніж розробники програмного забезпечення, але багато основних принципів коду залишаються. Регулярні вирази (або regex) мають a крута початкова крива навчання, але вони можуть бути надзвичайно потужний при правильному використанні.

    Найбільш складна частина - це вивчення синтаксису і навчання, як написати власний код регулярного виразу з нуля. Щоб заощадити час, я організував 30 різних фрагментів коду регулярного виразу, які можна включити до проектів розробки. Оскільки регулярний вираз не обмежується однією мовою, ви можете застосувати ці фрагменти до будь-якої сторінки JavaScript до PHP або Python.

    1. Сила пароля

    ^ (? =. * [AZ]. * [AZ]) (? =. * [! @ # $ & *]) (? =. * [0-9]. * [0-9]) (? = . * [az]. * [az]. * [az]). 8 $

    Перевірка сили пароля часто є суб'єктивною, тому не існує абсолютної правильної відповіді. Але я відчуваю, що цей фрагмент регулярного виразу є чудовою відправною точкою, якщо ви не хочете писати свій власний контролер міцності пароля з нуля. (Джерело)

    2. Шістнадцятковий колір

    # ([a-fA-F] | [0-9]) 3, 6

    Сфера веб-розробки є повсюдною з шестигранними кодами кольорів. Цей фрагмент регулярного виразу може бути використаний для витягання відповідностей шістнадцяткового коду з будь-якого рядка для будь-яких цілей. (Джерело)

    3. Перевірити адресу електронної пошти

    /[A-Z0-9._%+-]+@[A-Z0-9-]+.+.[A-Z]2,4/igm

    Одним з найпоширеніших завдань розробника є перевірка форматування рядка в стилі адреси електронної пошти. Для виконання цього завдання існує багато різних варіантів, тому посилання SitePoint пропонує два окремі фрагменти коду для перевірки синтаксису електронної пошти на рядок. (Джерело)

    4. Адреса IPv4

    / ((::(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\t (?: 25 [0-5] | 2 [0-4] [0-9] | [01]? [0-9] [0-9]?) \ T

    Подібно до адреси електронної пошти - це типова IP-адреса, яка використовується для ідентифікації конкретного комп'ютера, що має доступ до Інтернету. Цей регулярний вираз буде перевіряти рядок, щоб побачити, чи слід він за синтаксисом адреси IPv4. (Джерело)

    5. Адреса IPv6

    (([0-9a-fA-F] 1,4:) 7,7 [0-9a-fA-F] 1,4 | ([0-9a-fA-F] 1) , 4:) 1,7: | ([0-9a-fA-F] 1,4:) 1,6: [0-9a-fA-F] 1,4 | ([0-9a-fA-F] 1,4:) 1,5 (: [0-9a-fA-F] 1,4) 1,2 | ([0-9а] -fA-F] 1,4:) 1,4 (: [0-9a-fA-F] 1,4) 1,3 | ([0-9a-fA-F]) 1,4:) 1,3 (: [0-9a-fA-F] 1,4) 1,4 | ([0-9a-fA-F] 1,4 :) 1,2 (: [0-9a-fA-F] 1,4) 1,5 | [0-9a-fA-F] 1,4: ((: [0 -9a-fA-F] 1,4) 1,6): ((: [0-9a-fA-F] 1,4) 1,7 |:) | fe80: (: [0-9a-fA-F] 0,4) 0,4% [0-9a-zA-Z] 1, |: :( ffff (: 0 1,4) 0,1:) 0,1 ((25 [0-5] | (2 [0-4] | 1 0,1 [0-9]) 0,1 [0-9] )) 3,3 (25 [0-5] | (2 [0-4] | 1 0,1 [0-9]) 0,1 [0-9]) | ([0-9a-fA-F] 1,4:) 1,4: ((25 [0-5] | (2 [0-4] | 1 0,1 [0-9] ]) 0,1 [0-9])) 3,3 (25 [0-5] | (2 [0-4] | 1 0,1 [0-9])  0,1 [0-9]))

    Крім того, ви можете перевірити адресу нового синтаксису IPv6 за допомогою цього більш просунутого фрагмента регулярного виразу. Різниця є незначною, хоча й життєво важливою під час розвитку. (Джерело)

    6. Тисячі сепараторів

    d 1,3 (? = (d 3) + (?! d)) / g

    Традиційні системи нумерації вимагають коми, періоду або будь-якої іншої позначки кожної третьої цифри у більшій кількості. Цей код регулярно працює на будь-який номер і застосовуватиме будь-яку позначку, яку ви обираєте для кожної третьої цифри, що розділяється на тисячі, мільйони тощо (джерело)

    7. Перевести HTTP на гіперпосилання

    if (! s.match (/ ^ [a-zA-Z] +:: //)) s = 'http: //' + s; 

    Якщо ви працюєте в JavaScript, Ruby або PHP, цей регулярний вираз може виявитися дуже корисним. Він перевірятиме будь-який рядок URL, щоб побачити, чи має він префікс HTTP / HTTPS, а якщо ні, то підготуйте його відповідно. (Джерело)

    8. Витягніть домен з URL-адреси

    w / (?):) \ t

    Кожен домен веб-сайту містить початковий протокол (HTTP або HTTPS) і часто субдомен плюс додатковий шлях до сторінки. Ви можете використовувати цей фрагмент, щоб прорізати все це і повернути тільки доменне ім'я без додаткових надмірностей. (SourceL

    9. Сортувати ключові слова за кількістю слів

    ^ [^ s] * $ точно відповідає ключовому слову 1-го слова ^ [^ s] * s [^ s] * $ точно відповідає ключовому слову 2-х слів ^ [^ s] * \ t * відповідає ключовим словам не менше 2 слів (2 і більше) ^ ([^ s] * s) 2 [^ s] * $ точно відповідає ключовому слову 3-х слів ^ ([^ s] * \ t ) 4 [^] * $ відповідає ключовим словам із 5 слів і більше (longtail)

    Користувачі Google Analytics та Інструментів для веб-майстрів дійсно користуватимуться цим регулярним виразом. Він може сортувати та організовувати ключові слова на основі кількості слів, що використовуються в пошуку.

    Це може бути числовим (тобто всього 5 слів) або може співпадати з діапазоном слів (тобто 2 або більше слів). При використанні для сортування аналітичних даних це один потужний вираз. (Джерело)

    10. Знайдіть дійсний рядок Base64 у PHP

    php [] eval (base64_decode ((([A-Za-z0-9 + /] 4) * ([A-Za-z0-9 + /] 3 = | [A-Za-z0-9 + /] 2 ==)?) 1

    Якщо ви є розробником PHP, то в якийсь момент вам може знадобитися розбирати код, шукаючи двійкові об'єкти, кодовані Base64. Цей фрагмент може бути застосований до всього коду PHP і перевірятиметься на наявні рядки Base64. (Джерело)

    11. Дійсний номер телефону

    d 1,3? [-.]? (? (?: d 2,3))? [-.] d d d [-.]? d d \ t

    Короткий, солодкий, і по суті. Цей код регулярно перевірятиме будь-який традиційний синтаксис телефонного номера, який базується на американському стилі телефонних номерів.

    Оскільки це може перетворитися на досить складну тему, я рекомендую прокрутити цей потік Stack для більш детальних відповідей. (Джерело)

    12. Провідний пробіл

    ^ [s] + | [s] + $

    Використовуйте цей фрагмент коду, щоб витягнути провідний пробіл з рядка. Це не може бути великим завданням, але іноді це може впливати на висновок, коли витягується з бази даних або застосовується до іншого кодування документа. (Джерело)

    13. Витягніть джерело зображення)

    \ T< *[img][^\>] * [src] * = * [\ _ '] 0,1 ([^ \ t

    Якщо з якихось причин потрібно витягти джерело зображення безпосередньо з HTML, цей фрагмент коду є ідеальним рішенням. Незважаючи на те, що він може працювати безперебійно на сервері, розробники JS в інтерфейсі повинні розраховувати на метод .attr () jQuery для інтерфейсу. (Джерело)

    14. Перевірка дати в форматі DD / MM / YYYY

    ^ (? :( ?: 31 (\ _ | - | \ _) (?: 0? [13578] | 1 [02])) 1 | (? :( ?: 29 | 30) (\ t [?] (?: 0? [1,3-9] | 1 [0-2]) 2)) (? :( ?: 1 [6-9] | [2-9] г)? d 2) $ | ^ (?: 29 (/ - -). 0? 2 3 (? :(? :( ?: 1 [6-9] | [2-9] \ t (?: 0 [48] | [2468] [048] | [13579] [26]) | (?: (?: 16 | [2468] [048] | [3579] [26]) 00) )) $ | ^ (?: 0? [1-9] | 1 d | 2 [0-8]) (\ _ | - | \ t | (?: 1 [0-2])) 4 (? :( ?: 1 [6-9] | [2-9] d)?

    Дати складно, тому що вони можуть відображатися як текст + номери або просто як номери з різними форматами. PHP має фантастичну функцію дату, але це не завжди найкращий вибір при витягуванні сирого рядка. Натомість використовуйте цей регулярний вираз для цього конкретного синтаксису дати. (Джерело)

    15. Ідентифікатор відео YouTube YouTube

    /http:/(?:youtu be ;|(?: [as]2,3 .)?youtube\t =) ([w -] 11). * / gi

    YouTube зберігає ту саму структуру URL-адрес протягом багатьох років, оскільки він працює. Це також найпопулярніший веб-сайт для обміну відео в Інтернеті, тому відео YouTube зазвичай приводять до найбільшого трафіку.

    Якщо вам потрібно витягти ідентифікатор відео YouTube з URL-адреси, код регулярного виразу ідеальний і повинен відмінно працювати для всіх варіантів структур URL-адрес YouTube. (Джерело)

    16. Дійсний ISBN

    b (?: ISBN (? ::? |))? ((?: 97 [89]) d 9 [dx]) b / i

    Друковані книги дотримуються системи нумерації, відомої як ISBN. Це може стати досить складним, якщо врахувати відмінності між ISBN-10 та ISBN-13.

    Однак цей неймовірний фрагмент дозволяє перевірити номер ISBN і перевірити, чи це ISBN10 або 13. Усі коди написані на PHP, тому це має бути надзвичайно корисним для веб-розробників. (Джерело)

    17. Перевірте Поштовий індекс

    d 5 (?: [- s] d 4)?

    Творець цього фрагменту не тільки звільнив свою роботу безкоштовно, але і взяв час, щоб пояснити це. Цей фрагмент буде корисним, якщо ви підбираєте типовий 5-значний поштовий код або довшу 9-значну версію.

    Майте на увазі, що це в першу чергу призначено для американської системи поштових індексів, тому це може потребувати коригування для інших країн. (Джерело)

    18. Дійсне ім'я користувача Twitter

    / @ ([A-Za-z0-9 _] 1,15) /

    Ось невеликий фрагмент коду для відповідності з іменами користувача Twitter, знайденими в рядку. Він перевіряє на @mention синтаксис, який ідеально підходить для автоматичного сканування вмісту твіту (або твітів). (Джерело)

    19. Номери кредитних карток

    ^ (?: 4 [0-9] 12 (?: [0-9] 3)? | 5 [1-5] [0-9] 14 | 6 (?: 011 | 5 [ 0-9] [0-9]) [0-9] 12 | 3 [47] [0-9] 13 | 3 (?: 0 [0-5] | [68] [0-9] ]) [0-9] 11 | (?: 2131 | 1800 | 35 d 3)

    Перевірка номера кредитної картки часто вимагає безпечної платформи, розміщеної в іншому місці. Але regex може бути використаний для мінімальних вимог типового номера кредитної картки.

    Більш повний перелік кодів для окремих карт можна знайти тут. Це включає в себе Visa, MasterCard, Discover та багато інших. (Джерело)

    20. Знайти атрибути CSS

    s * [a-zA-Z -] + * [:] 1 [a-zA-Z0-9 s. #] + [;] 1

    Це може бути рідко, щоб запустити Regex над CSS, але це не неймовірно дивна ситуація.

    Цей фрагмент коду може бути використаний для вилучення кожного відповідного CSS-властивості та значення з окремих селекторів. Його можна використовувати з будь-якої причини, можливо, для перегляду фрагментів CSS або для видалення дублікатів властивостей. (Джерело)

    21. Газа HTML коментарі

    Якщо з будь-якої причини потрібно видалити всі коментарі з блоку HTML, це код регулярного виразу, який слід використовувати. Поряд з виразом ви знайдете приклад PHP з використанням preg_replace. (Джерело)

    22. URL-адреса профілю Facebook

    /(?:http:\_)?(?:www:)\t??\t (?: [w]] * (*)

    Facebook неймовірно популярний і пережив багато різних схем URL-адрес. У ситуації, коли ви приймаєте URL-адреси профілів від користувачів, може бути корисно розібрати рядки та підтвердити, що вони структуровані належним чином. Цей фрагмент може зробити саме це, і він ідеально підходить для всіх посилань у стилі FB. (Джерело)

    23. Перевірте версію Internet Explorer

    *. * MSIE [5-8] (?: [0-9] +)? (?!. * Trident / [5-9] 0).

    Перехід Microsoft на Edge не був одностайним, і багато людей все ще покладаються на класичний Internet Explorer. Розробникам часто потрібно перевіряти версії IE для обробки невідповідностей з двигунами рендеринга.

    Цей фрагмент можна використовувати в JavaScript для тестування агента браузера, на основі якої використовується версія Internet Explorer (5-11). (Джерело)

    24. Витяг ціни

    /(\T [0-9,]+(\t

    Ціни надаються у різних форматах, які містять десяткові знаки, коми та символи валют. Цей регулярний вираз може перевірити всі ці різні формати, щоб витягнути ціну з будь-якого рядка. (Джерело)

    25. Розбір заголовка електронної пошти

    / ([A-Z0-9._%+-]+@(?:[A-Z0-9-]+\t

    З цією однією лінією коду ви можете розібрати за допомогою заголовка електронної пошти “до” інформацію з заголовка. Її можна використовувати в тандемі разом з кількома повідомленнями.

    Якщо ви хочете уникнути регулярного виразу для цього завдання, ви можете покладатися на бібліотеку аналізу. (Джерело)

    26. Відповідний конкретний тип файлу

    /^(.* \ _(?!(htm|html|class|js)$))?

    Коли ви маєте справу з різними форматами файлів, такими як .xml, .html і .js, це допоможе перевірити файли як локально, так і завантажені користувачами. Цей фрагмент витягує розширення файлу, щоб перевірити, чи є він дійсним з серії дійсних розширень, які можна змінити за потреби. (Джерело)

    27. Відповідність рядку URL

    ([а-а-Z-0, \ _ \ _. \ t -9 @:% _ +. ~ #? & // =] *)? / Gi

    Цей фрагмент можна використовувати як для рядків HTTPS, так і для HTTP, щоб перевірити, чи відповідає текст традиційному синтаксису домену TLD. Також існує проста реалізація цього регулярного виразу з використанням RegExp JavaScript. (Джерело)

    28. Додайте rel =”nofollow” до посилань

    (] *) (href = "https?: //) ((?! (?: (?: www.)?". implode ('| (?: www.)?', $ follow_list). ') ) [^ "] +)" ((?!. * brel =) [^>] *) (?: [^>] *)>

    Якщо ви працюєте з пакетом HTML-коду, можна застосувати ручну працю до повторюваних завдань. Регулярні вирази ідеально підходять для цього випадку, і вони заощадять багато часу.

    Цей фрагмент може витягти всі якірні посилання з блоку HTML і додати rel =”nofollow” атрибут до кожного елемента. Розробник, який написав цей код, був достатньо люб'язний, щоб опублікувати вихідний файл плюс робочий приклад в PHP.

    29. Відповідність запиту медіа

    / @ media ([^ ] +) ([s] +?) s * / g

    Розділити CSS-запити на їх параметри та властивості. Це допоможе вам більш чітко проаналізувати зовнішні CSS з більш прямим акцентом на роботі коду. (Джерело)

    30. Синтаксис пошуку Google

    /([+-]?(?:'.+?'|".+?"|[^+\-] 1 [^] *)) / g

    Ви можете створити свій власний код регулярного виразу для маніпулювання текстом для пошуку за допомогою синтаксису торговельної марки Google. Знак "плюс" (+) позначає додаткові ключові слова, а знак мінус (-) означає слова, які слід ігнорувати та видалити з результатів.

    Це досить складний фрагмент, але він використовується належним чином, щоб забезпечити базу для створення власного алгоритму пошуку. (Джерело)

    Підведення підсумків

    Шлях до освоєння регулярного виразу довгий, але корисний, якщо дотримуватися його. Крім типових інструментів регулярного виразу, найкращим способом вивчення є повторення. Спробуйте створити веб-програми, які покладаються на ці фрагменти регулярного виразу, щоб дізнатися, як вони працюють у реальному веб-застосунку. І якщо у вас є інші фрагменти, які пропонують, ви можете опублікувати їх в області коментарів нижче.

    Тепер читайте:

    50 корисних CSS-фрагментів кожен дизайнер повинен мати