генератор паролей html код
Пишем свой генератор паролей
Готовый код с уникальным алгоритмом шифрования. Возьми и сделай.
Недавно мы писали про уязвимость паролей в фейсбуке и про способы их шифрования. Настало сделать свой собственный генератор паролей с хешем и секретной строкой. Пройдите с нами этот путь, и у вас появится собственное приложение для создание паролей, которое вы сможете сделать сколько угодно секретным, а при желании — воссоздать.
В этом уроке мы создадим страницу, которая будет генерировать пароли для любых сайтов. На входе вы будете давать ей адрес сайта, а на выходе она даст вам безопасный уникальный пароль. Безопасность будет достигаться за счет секретного слова и особого алгоритма шифрования. Также вы сможете вспомнить пароль от любого сайта, если знаете секретное слово и адрес сайта.
Как устроен наш алгоритм
Мы будем брать адрес сайта и шифровать его с помощью алгоритма хеширования MD5. Результат шифрования и будет нашим паролем.
О хешировании мы уже писали, общий смысл такой: особый алгоритм шифрует текст таким образом, что по итоговому зашифрованному тексту невозможно восстановить исходный. Непонятна ни длина исходного текста, ни его содержимое.
Слабое место алгоритма только в том, что если зашифровать им один и тот же текст, получится один и тот же результат. То есть алгоритм работает предсказуемо: если зашифровать адрес mail.yandex.ru с помощью алгоритма MD5, всегда получится B81D1C770FD8F323B57CC73ED7B2546E. Это небезопасно.
Чтобы пароли были более уникальными, мы добавим к адресу сайта секретное слово, которое попросим у пользователя. И еще одно секретное слово впишем прямо в код программы. Вот эти два секретных слова и будут обеспечивать нашу безопасность пароля.
Всё, что осталось сделать — склеить адрес сайта и два секретных слова, зашифровать алгоритмом MD5, и вуаля — у нас будет уникальный трудночитаемый пароль, который никто никогда не подберет перебором.
Готовим каркас
За основу мы возьмём страницу, которую мы создавали, когда делали свой список задач. Если вы её ещё не читали — почитайте, будет гораздо легче понимать, что тут происходит. В нашем случае каркас будет выглядеть так:
Сохраняем файл как generator.html, открываем в браузере и видим пока пустую страницу с заголовком вкладки «Генератор паролей» и больше ничего. Всё нормально, так и должно быть.
Расставляем содержимое
Вот какой минимум информации должен быть на нашей странице с генератором:
Разместим всё это на странице в разделе в том же порядке:
Сохраняем под тем же именем смотрим что получилось и не расстраиваемся от внешнего вида. Его мы поправим на следующем шаге.
Настраиваем стили
Стили помогают улучшить внешний вид страницы и установить нужный размер шрифта, его расположение, отступы, да и вообще всё, что мы видим на экране. Добавим стилей в наш генератор в раздел
Генератор паролей для сайта
Дата публикации: 2013-11-14
От автора: при создании механизма регистрации пользователей на сайте, иногда возникает необходимость генерации пароля для пользователя. Так как пароли, придуманные пользователями для своих учетных записей, зачастую очень просты, а значит, уязвимы для злоумышленников. Поэтому в данном уроке мы с Вами создадим генератор паролей для сайта, благодаря которому Вы сможете обеспечить высокую безопасность создаваемых учетных записей.
Постановка задачи
Для сегодняшнего урока, я создал очень простую html страницу, которую мы будем использовать для сегодняшнего скрипта:
Бесплатный курс по PHP программированию
Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC
В курсе 39 уроков | 15 часов видео | исходники для каждого урока
Вот исходный код, данной страницы:
Используя данную страницу, мы с Вами должны создать скрипт, который будет выполнять генерацию пароля для пользователя. Конечно, решить данную задачу можно различными способами, но перед этим, давайте определимся какой, пароль должен получиться в результате генерации, что бы он был безопасным.
Итак, какой же пароль является безопасным? Это такой пароль, который очень сложно подобрать, так как очень часто процесс взлома учетной записи сводится к простому подбору пароля – то есть перебор символов, пока не найдется подходящая последовательность. Поэтому, согласитесь, если пароль будет состоять из малого количества символов и, к примеру, только из малых английских букв – его будет очень легко подобрать. Но если же мы создадим пароль, состоящий из малых и больших букв, а также включающий в себя цифры – это уже будет довольно сложный и безопасный пароль. Поэтому мы с Вами в данном уроке, реализуем генерацию двух видов паролей. Итак, давайте приступим.
Генератор случайных паролей на JavaScript
Разработчик под ником Foolish Developer опубликовал пошаговое руководство по созданию генератора надежных и уникальных паролей с помощью JavaScript, HTML и CSS. Пароли генерируются на основе специальных символов, букв и цифр.
Структура генератора
Ниже представлен итоговый вид генератора. Он состоит из фона, маленькой рамки с текстом, поля, а также кнопок для создания и копирования пароля.
Шаг 1: создание поля с помощью HTML- и CSS-кода
Код ниже создает на веб-странице поле. Автор задал фиолетовый цвет фона веб-страницы, а цветом фона рамки указал белый.
Шаг 2: добавление заголовка в рамке
Заголовок создается следующим кодом:
Шаг 3: создание поля для генерации кода
Шаг 4: создание кнопок для генерации и копирования пароля
Шаг 5: активация кнопки генерации кода с помощью JavaScript
Для начала нужно установить переменную ID входа ( password ).
С помощью var passwordLength указывается количество символов в будущем пароле.
Далее пароль связывается с полем ввода.
Шаг 6: Активация кнопки копирования пароля
С помощью кода ниже все, что написано в поле ввода, можно будет скопировать запрограммированной кнопкой.
Шаг 7: Окончательный JavaScript-код
Онлайн генератор паролей на CSS + JS
Иногда нужно создать такой пароль, что даже в голосу не приходит, и в таком расположение, чтоб можно было запомнить. И здесь генератор отлично справляется, ведь его можно разместить на отдельной страницы на интернет ресурсе, где каждый может воспользоваться.
Ведь использование одного и того же пароля для каждого сайта опасно. Если ваш пароль используется для взлома или взлома данных, вся ваша жизнь в интернете может оказаться под угрозой. Для этого нужно создать случайный пароль, а если у вас несколько аккаунтов, то здесь для каждой учетной записи, которой вы владеете. Где после всего, они защищены главным паролем.
Проверено на работоспособность, где выглядит так после установки:
body <
background: #15569a;
font-family: ‘Varela Round’;
font-size: 100%;
>
span <
position: absolute;
top: 25px;
left: 0;
>
a <
text-decoration: none;
color: #efeaea;
>
.randomna-chisla:hover <
background: #0c5273;
box-shadow: 0px 0px 13px 1px rgba(191, 185, 185, 0.24), 0px 0px 8px 2px rgba(134, 130, 130, 0.52);
>
Генератор надежных и запоминаемых паролей на Javascript
Представляемый генератор паролей создает относительно легко запоминающиеся и, в тоже время, трудноподбираемые пароли. Основная идея состоит в том, что пароли генерируются на основе слогов и поэтому выглядят как слова или словосочетания. Для лучшего запоминания используются заглавные буквы в начале каждого слога.
Проект на Google.Code:
code.google.com/p/jspassgen/downloads/list
Пример работы можно посмотреть здесь:
бизнес-книги.рус/ext/jspassgen/example.html
За основу был взят несколько другой алгоритм, хорошо описанный автором, Сергеем Михайловичем Свешниковым:
«Составлялись слоги из одной гласной и одной согласной буквы, расположенных в случайном порядке относительно друг-друга. Случайные буквы в пароле делались заглавными. Некоторые слоги разделялись цифрами, причём число цифр всегда было чётно (но случайно и не больше половины). Цифры могли стоять парами. Получался пароль заданной длинны, достаточно красивый и сложный. Число символов было чётным (ну нравилось мне так)»
Данный же алгоритм не фиксирует число символов в пароле, и рассчитан на практическое применение в качестве списка случайных предлагаемых пользователю паролей, например, при регистрации, позволяя, при желании, изменить сложность пароля регулированием количества слогов.
Так же присутствует механизм регуляции количества цифр в предлагаемых паролях, путем введения коэффициента numProb и его шага для уменьшения вероятности появления цифр с каждым новым слогом.
P.S.: Светлые мысли из комментариев:
Советуемые программы-генераторы паролей:
Sicness #:
идея снижает энтропию пароля и как следствие, применять стоит не везде.
docomo #:
… Сгенерированный на js пароль предлагается пользователю как один из вариантов непосредственно в форме регистрации, в то время как созданный на сервере пароль ставится принудительно.
- С чем связывают понятие тренированность
- a problem has been detected and windows has been shut down что делать при запуске