Oc-windows.ru

IT Новости из мира ПК
0 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Регулярное выражение для email javascript

Проверка адреса email и номера телефона на javascript

Предоставляя пользователю возможность заполнения полей на сайте, следует проверять введенные данные на валидность. Это позволит предупредить пользователя о случайных ошибках, а так же даст дополнительную защиту от спама. Ярким примером является форма обратной связи, обязательными полями которой часто бывают email и телефон. Займемся их проверкой на правильность заполнения с помощью javascript.

Информация лучше воспринимается на примерах, поэтому посмотрим готовую форму в действии:

Пожалуйста, заполните все поля формы!

E-mail:
Телефон:

Для начала разберем применяемые регулярные выражения, а полный код формы и javascript функций я приведу в конце статьи.

Валидность адреса электронной почты

Рассмотрим адрес электронной почты (test@mail.ru). Вот его обязательные части:

  • Название (test) — один или много символов;
  • Знак собаки (@);
  • Доменное имя почтового сервера (mail) — один или много символов;
  • Точка (.);
  • Доменное имя первого уровня (ru) от двух до пяти букв.

Составим регулярное выражение для наших требований:

Разберём правило по частям:

  1. Регулярное выражение должно открываться и закрываться символами «/» . После закрывающегося символа можно указать директиву. В нашем случае такой директивной является «i» , которая отключает проверку вводимых букв на регистр. То есть, становится не важно, ввели «test@mail.ru» или «Test@Mail.RU».
  2. Знаки «^» и «$» обозначают начало и конец проверяемой строки. Если их убрать, то правило вернет положительный результат даже если в начале или конце электронного адреса поставить запрещенные знаки. То есть, при вводе «%:&test@mail.ru#6&» функция проверки вернет положительный результат, так как в строке имеется последовательность символов, удовлетворяющая нашему правилу. Для исключения такой возможности указываем, что правило должно применяться ко всей строке, а не к её части.
  3. Блок «[w-.]+» отвечает за проверку названия ящика. В квадратных скобках указываем разрешенные символы: «w» — все латинские буквы, цифры и знак подчеркивания. Так же рекомендую добавлять знак тире и точку «-.» . «+» после квадратных скобок указывает на возможность повторения символов — один или много раз.
  4. Далее идет знак собаки и доменное имя почтового сервера — «@[w-]+» . Здесь практически тоже самое что и в предыдущем блоке. Исключаем только из набора символов точку.
  5. Осталось прописать правило для проверки наличия точки и корректности доменного имени верхнего уровня (ru,com,info). «.[a-z]<2,4>» . Для обозначения знака точки мы указываем её с обратным слешем «.» Без него она будет восприниматься зарезервированным символом регулярки, который обозначает возможность наличия на её месте любого символа. За точкой должно следовать доменное имя верхнего уровня. Это минимум 2 латинские буквы — «[a-z]<2,4>» .

Разобранный пример немного упрощен для лучшего восприятия. У него есть недостаток — первым знаком в email не может быть тире или точка, но приведенное регулярное выражение этого не учитывает. Чтобы это исправить следует его немного поправить:

Проверка валидности номера телефона в javascript

С номером телефона ситуация сложнее, так как номер можно ввести десятками способов:

Есть несколько выходов из ситуации:

  • продумать все возможные шаблоны и составлять для них правила;
  • заставить посетителя вводить телефон по определенному шаблону;
  • ограничиться проверкой на случайные ошибки.

Для форм обратной связи последний вариант кажется наилучшим. Во-первых, если человек не хочет указывать свой номер телефона, то никакие проверки на корректность не помогут. Он просто введет несуществующий или чужой номер. Во-вторых, посетители сайта не любят когда их загоняют в определенные рамки. Поэтому рекомендую использовать регулярное выражение следующего типа:

В правиле указываем что первый и последний знак должен быть обязательно цифрой — «d» , а в середине разрешаем использовать знаки скобок, пробел и знак дефиса — «[d() -]<4,14>» , от 4 до 14 символов. Так как скобки и пробел являются зарезервированными элементами регулярных выражений, перед ними ставим обратный слеш.

Для любителей жестких шаблонов приведу пример проверки номера вида 8 (999) 123-45-64

Исходный код примера: html и javascript

Это полный код тестовой странички, на которой я использовал форму и js скрипты для отладки правил из этой статьи. Можете скопировать его и протестировать у себя на компьютере.

Это демонстрационная версия. В случае с формой обратной связи нам следует проводить проверку полей не при нажатии на кнопку, а при попытке отправить её:

Регулярное выражение для email javascript

Регулярные выражения — мощный инструмент, который должен быть в арсенале каждого разработчика. С их помощью можно находить совпадения в строках на основе довольно сложных шаблонах. Используя регулярные выражения при создании динамических веб-сайтов, разработчик экономит кучу времени.

Процесс разработки веб-приложений значительно отличается от разработки программного обеспечения, однако основные моменты при программировании одинаковы в обоих случаях, поэтому выгода от использования регулярных выражений будет видна всем.

Изучение регулярных выражений (regex) довольно сложный процесс, особенно для начинающих, но при правильном подходе, вы освоите чрезвычайно мощный и полезный инструмент.

Самым сложным этапом при обучении с нуля является понимание синтаксиса регулярных выражений. Чтобы не тратить время на написание своих собственных регулярных выражений, автор статьи собрал 30 различных примеров, которые чаще всего используются при работе над различными проектами.

Как известно, регулярные выражения не «привязаны» к какому-то определенному языку программирования, поэтому вы можете использовать приведенные ниже примеры выражений при разработке проектов на различных языках. Например, на JavaScript, PHP или Python.

Лучшее регулярное выражение для валидации email в web формах

Оговорка «на клиенте» сделана не просто так. Задача валидации на клиенте — подсказать пользователю, где он ошибся в написании email-а. Важно случайным образом не запретить пользователю с непредусмотренным емейлом воспользоваться формой. Учитывая то, какие варианты емейла могут быть (неожиданные домены, появляющиеся по пучку каждый месяц, ip адреса в качестве домена, и символы точки и симполы +, и другие неизвестные широкому обывателю вещи), напрашивается вывод, что лучшая валидация проверит емейл на наличие текста вида текст-собачка-текст-точка-текст.

Проверка надежности пароля

Надежность пароля — довольно субъективное понятие, поэтому не существует универсального решения для проверки. Однако, приведенный выше пример регулярного выражения может стать хорошей отправной точкой, если вы не желаете придумывать выражение для проверки пароля с нуля.

Код цвета в шестнадцатеричном формате

Шестнадцатеричные коды цветов используются при веб-разработке очень часто. Это регулярное выражение может быть поможет сравнить: совпадает ли какая-либо строка с шаблоном шестнадцатеричного кода.

Проверка адреса электронной почты

Одной из самых распространенных задач при разработке является проверка соответствия введенной пользователем строки формату адреса электронной почты. Существует множество различных вариантов выражений для решения этой задачи, автор этой статьи предлагает свой оригинальный вариант.

IP-адрес (v4)

Как e-mail может использоваться для идентификации посетителя, так IP-адрес является идентификатором конкретного компьютера в сети. Приведенное регулярное выражение проверяет соответствие строки формату IP-адреса v4.

IP-адрес (v6)

Вы также можете проверить строку на соответствие формату IP-адреса новой, шестой версии более продвинутым регулярным выражением.

Разделитель в больших числах

Традиционными разделителями в больших числах являются запятые, точки или другие знаки, повторяющиеся в числе через каждые 3 символа. Приведенный код регулярного выражения работает с любым числом и любым определенными вами символами для разделения трехзначных частей в больших числах: тысячах, миллионах и т.п.

Добавление протокола перед гиперссылкой

Независимо от того, с каким языком вы работаете: JavaScript, Ruby или PHP, это регулярное выражение может оказаться очень полезным. С его помощью проверяется любой URL-адрес на наличие в строке протокола, и если протокол отсутствует, указанный код добавляет его в начало строки.

«Вытягиваем» домен из URL-адреса.

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

Сортировка ключевых фраз по количеству слов

Это действительно полезные выражения для пользователей Google Analytics и инструмента для веб-мастеров. Ведь с помощью них можно отсортировать ключевые фразы, используемые посетителями при поиске по количеству слов, входящих в них.

Выражения могут проверять фразы, содержащие определенное количество слов (например, 5), а также фразы количество слов в которых более двух, трех и т.д. Одно из самых мощных выражений, используемое для сортировки данных аналитики.

Поиск валидной строки Base64 в PHP

Если вы являетесь PHP-разработчиком, то иногда вам может понадобиться найти объект, закодированный в формате Base64. Указанное выше выражение может использоваться для поиска закодированных строк в любом PHP-коде.

Проверка телефонного номера

Это регулярное выражение применяется для проверки любого номера телефона, прежде всего, американского формата телефонных номеров.

Проверка телефонных номеров может стать довольно сложной задачей, поэтому автор статьи рекомендует детально ознакомиться с различными вариантами решения на сайте stackoverflow.com

Для проверки российских телефонных номеров используйте следующее выражение:

Начальные и конечные пробелы

Используйте это регулярное выражение для того, чтобы избавиться от начальных и конечных пробелом в строке. Это не особо распространенная задача, но иногда это выражение может быть полезным. Например, при получении данных из БД или передачи строки скрипту в другой кодировке.

«Вытягиваем» HTML-код изображения

Если по какой-либо причине вам необходимо «вытянуть» HTML-код изображения прямо из кода страницы, это регулярное выражение станет для вас идеальным решением. Хотя оно может без проблем работать на стороне сервера, для фронтенд-разработчиков приоритетней будет использовать метод attr() библиотеки jQuery вместо указанного регулярного выражения.

Проверяем дату на соответствие формату DD/MM/YYYY

Проверять даты сложно, потому что они могут быть представлены в различных форматах, в том числе содержащих и числа, и текст.

В PHP имеется отличная функция date(), но она не всегда подходит, ведь в нее может быть передана необработанная строка. Поэтому для проверки указанного формата даты нужно использовать приведенное выше регулярное выражение.

Совпадение строки с адресом видеоролика на YouTube

На протяжении нескольких лет на Youtube не меняется структура URL-адресов. Youtube является самым популярным видео хостингом в Интернет, благодаря этому, видео с Youtube набирают наибольший трафик.

Если вам необходимо получить ID какого-либо видеоролика с Youtube, воспользуйтесь приведенным выше регулярным выражением. Это наилучшее выражение, подходящее для всех вариантов URL-адресов на этом видео-хостинге.

Проверка ISBN

Информация обо всех печатные изданиях, хранится в системе, известной как ISBN, которая состоит из 2 систем: ISBN-10 и ISBN-13. Неспециалисту очень сложно увидеть различия между этими системами. Однако, представленное выше регулярное выражение позволяет проверять соответствие кода ISBN сразу обоим системам: будь то ISBN-10 или ISBN-13. Код написан на PHP, поэтому это решение подходит исключительно для веб-разработчиков.

Проверка почтового индекса (Zip Code)

Автор этого регулярного выражения не только придумал его, но и еще нашел время его описать. Это выражение будет полезно вам, если вы проверяете совпадение строки со стандартным пятизначным индексом или его удлиненным вариантом, содержащим 9 знаков. Обращаем ваше внимание, что это выражение подходит только для проверки американских почтовых индексов. Для индексов других стран необходима настройка.

Для проверки российских почтовых индексов используйте следующее выражение:

Проверка правильности имени пользователя Twitter

Это небольшое регулярное выражение помогает найти имя пользователя Twitter внутри текста. Оно проверяет наличие имени в твитах по шаблону: @username.

Проверка номера кредитной карты

Проверка номера кредитной карты очень часто проводится при осуществлении платежей в различных платежных онлайн -системах. Однако, регулярное выражение обеспечивает минимальную проверку стандартной кредитной карты.

Вы можете ознакомиться с более полным списком кодов для детальной проверки карт. Список включает в себя такие системы как Visa, MasterCard, Discover и многие другие.

Поиск CSS-атрибутов

Ситуация, когда придется воспользоваться указанным регулярным выражением, может сложиться очень редко, но не факт что не сложится никогда

Этот код можно использовать когда будет необходимо «вытянуть» какое-либо CSS-правило из списка правил для какого-нибудь селектора.

Удаление комментариев в HTML

Если вам необходимо удалить все комментарии из блока HTML-кода, воспользуйтесь этим регулярным выражением. Чтобы получить желаемый результат, вы можете воспользоваться PHP-функцией preg_replace().

Проверка на соответствие ссылке на Facebook-аккаунт

Если вам необходимо узнать у посетителя вашего сайта адрес его странички в Facebook, попробуйте это регулярное выражение. Оно поможет вам проверить правильность указанного пользователем URL. Этот код отлично подходит для проверки ссылок в этой соцсети.

Проверка версии Internet Explorer

Несмотря на то, что Microsoft выпустил новый браузер Edge, многие пользователи до сих пор пользуются Internet Explorer. Веб-разработчикам часто приходится проверять версию этого браузера, чтобы учитывать особенности разных версий при работе над своими проектами.

Вы можете использовать это регулярное выражения в JavaScript-коде чтобы узнать какая версия IE (5-11) используется.

«Вытягиваем» цену из строки

Цена какого-либо товара может быть указана в различных форматах: в ней могут встречаться запятые, знаки после запятой и символы валюты.

Указанное выше регулярное выражение учитывает различные форматы отображения цены, с его помощью вы сможете «вытянуть» цену из любой символьной строки.

Разбираем заголовки в e-mail

С помощью этого небольшого выражения вы сможете разобрать заголовок e-mail сообщения, чтобы извлечь оттуда список адресатов. Выражение может быть использовано и в случае, если адресатов несколько.

Вместо регулярных выражений, для разбора заголовков e-mail вы можете воспользуйтесь библиотекой на PHP.

Соответствие имени файла определенному типу

Если в вашем приложении существует возможность загрузки файлов на сервер, это регулярное выражение может помочь вам проверить файлы перед тем как посетитель их загрузит.

С помощью этого кода можно получить расширение загружаемого файла и проверить присутствует ли оно в списке разрешенных к загрузке.

Соответствие строки формату URL

Регулярное выражение может проверять URL-адреса с указанием протоколов HTTP и HTTPS на предмет соответствия синтаксису доменов TLD.

Существует простой способ проверки с использованием JavaScript RegExp.

Добавление атрибута rel=”nofollow” в теге ссылки

Если вы много работаете с HTML-кодом, то вам захочется автоматизировать часто повторяющиеся действия. Регулярные выражения отлично подходят для решения этой задачи и сэкономят много вашего времени.

Используя приведенный код, например, совместно с PHP, вы сможете «вытянуть» код ссылок из блоков HTML-кода и добавить в каждую из них атрибут rel=”nofollow”.

Работа с media query

Вы можете разбивать строки содержащие медиа-запросы на части, состоящие из параметров и свойств. Указанное выражение может быть полезно для анализа стороннего CSS-кода. Используя его вы сможете, например, более подробно понять как устроен чужой код.

Синтаксис поисковых выражений Google

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

Это довольно сложное выражение, но если разобраться как использовать его должным образом, приведенный код может стать основой для построения собственного алгоритма поиска.

Заключение

Путь к пониманию регулярных выражений довольно труден, однако, если вы будете его придерживаться, результат вас не разочарует. Попробуйте использовать приведенные в статье регулярные выражения при создании своего веб-приложения. Таким образом вы сможете понять как работают выражения из примеров, приведенных в статье, в реальности.

dreamstarter / Javascript — Simple email val > Last active Jun 19, 2019

function checkEmail(email) <
var reg = /^([A-Za-z0-9_-.])+@([A-Za-z0-9_-.])+.([A-Za-z]<2,4>)$/;
if (!reg.test(email)) return false;
return true;
>

This comment has been minimized.

Copy link Quote reply

kieraneglin commented Jun 10, 2018 •

In shorter form:

This comment has been minimized.

Copy link Quote reply

jordan-burnett commented Jun 13, 2018

Landed here from google. This regex would fail for some valid e-mail addresses:

This comment has been minimized.

Copy link Quote reply

nhammond101 commented Jul 1, 2018 •

This comment has been minimized.

Copy link Quote reply

zouhenry commented Oct 30, 2018 •

This is a very basic regex email validator. it doesn’t work for email addresses with special characters: !def!xyz%abc@example.com and quoted emails: «Fred Bloggs»@example.com

The exact rule is that any ASCII character, including control
characters, may appear quoted, or in a quoted string. When quoting
is needed, the backslash character is used to quote the following
character. For example

is a valid form of an email address. Blank spaces may also appear,
as in

The backslash character may also be used to quote itself, e.g.,

In addition to quoting using the backslash character, conventional
double-quote characters may be used to surround strings. For example

are alternate forms of the first two examples above. These quoted
forms are rarely recommended, and are uncommon in practice, but, as
discussed above, must be supported by applications that are
processing email addresses. In particular, the quoted forms often
appear in the context of addresses associated with transitions from
other systems and contexts; those transitional requirements do still
arise and, since a system that accepts a user-provided email address
cannot «know» whether that address is associated with a legacy
system, the address forms must be accepted and passed into the email
environment.

Without quotes, local-parts may consist of any combination of
alphabetic characters, digits, or any of the special characters

period («.») may also appear, but may not be used to start or end the
local part, nor may two or more consecutive periods appear. Stated
differently, any ASCII graphic (printing) character other than the
at-sign («@»), backslash, double quote, comma, or square brackets may
appear without quoting. If any of that list of excluded characters
are to appear, they must be quoted. Forms such as

Klensin Informational [Page 6]

RFC 3696 Checking and Transformation of Names February 2004

are valid and are seen fairly regularly, but any of the characters
listed above are permitted. In the context of local parts,
apostrophe («‘») and acute accent («`») are ordinary characters, not
quoting characters. Some of the characters listed above are used in
conventions about routing or other types of special handling by some
receiving hosts. But, since there is no way to know whether the
remote host is using those conventions or just treating these
characters as normal text, sending programs (and programs evaluating
address validity) must simply accept the strings and pass them on.

In addition to restrictions on syntax, there is a length limit on
email addresses. That limit is a maximum of 64 characters (octets)
in the «local part» (before the «@») and a maximum of 255 characters
(octets) in the domain part (after the «@») for a total length of 320
characters. Systems that handle email should be prepared to process
addresses which are that long, even though they are rarely
encountered.

Регулярное выражение проверки email

Дата публикации: 2016-08-08

От автора: приветствую вас друзья. В этой статье мы рассмотрим различные варианты регулярных выражений для валидации emai, а также составим собственное регулярное выражение проверки email. Приступим?

Валидация адреса email — это, пожалуй, одна из наиболее распространенных задач при работе с регулярными выражениями. Это и не удивительно, поскольку email в современном вебе используется сплошь и рядом. Без него практически не обходятся при регистрации пользователей. И вот здесь нам нужно проверить, а соответствует ли введенная пользователем в поле строка формату email.

Сразу отмечу, что наиболее точный ответ даст только вариант с обратной связью. Суть его заключается в том, что по введенному адресу отправляется письмо со ссылкой, по которой пользователь должен перейти для подтверждения регистрации. Соответственно, регистрация будет завершена только в том случае, если пользователь ввел реальный email.

Это единственный 100% способ проверки email. Все прочие нам дадут лишь проверку на соответствие формату, не более. Но поскольку у нас есть задача составить регулярное выражение — давайте его составим. Тем более что его вполне можно использовать на стороне клиента, тем самым улучшив юзабилити вашей формы регистрации.

Итак, начать стоит с того, что в сети вы можете встретить массу различных вариантов регулярок для проверки email. Как вам такой вариант?

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC

В курсе 39 уроков | 15 часов видео | исходники для каждого урока

Страшно, не правда ли? Это шаблон для валидации email согласно стандарту. Я, конечно же, ни в коем разе не советую вам использовать такие шаблоны. Советую подыскать что-то попроще или составить шаблон самому. Собственно, пойду дальше — советую использовать максимально простой шаблон. Объясню почему.

Допустим вы составили или нашли правильный шаблон, который будет принимать только email, соответствующий формату. Например, я нашел вот такой:

Это первый попавшийся шаблон, который я нашел в сети. Как видим, этот шаблон работает достаточно криво, поскольку второй email был забракован. Хотя это вполне реальный email. А вот остальные, которые я придумал на ходу, были пропущены. Отсюда простой вывод: не заморачивайтесь с созданием универсальных шаблонов, поскольку пользователь вполне может придумать email. Используйте простейший шаблон, который будет проверять наличие знака @ в строке, а также наличие символов до и перед ней. К примеру, вот такая регулярка вполне сгодится:

Результат даже лучше предыдущего. Ну а на этом у меня сегодня все. Больше о регулярных выражениях вы можете узнать из нашего курса по регулярным выражениям. Удачи!

Хотите изучить регулярные выражения на PHP?

Посмотрите 12-ти часовой видео курс по регулярным выражениям на PHP!

Читать еще:  Java округление double до двух знаков
Ссылка на основную публикацию
Adblock
detector