Парольная защита

Парольная защита страницы на стороне клиента

Защита паролем доступа к Web-странице обычно обеспечивается посредством серверных сценариев. Однако эту же задачу можно решить и с помощью клиентского сценария, применив или объект Image, или объект XMLHttpRequest для передачи на сервер введенного пароля и получения ответа. При этом серверный сценарий, обрабатывающий введенный пользователем пароль, не требуется,поскольку пароль является именем некоторого особого файла на вашем сайте. Главная особенность решения задачи парольной защиты на стороне клиента состоит в том, что в сценарии проверки правильности пароля последний не должен упоминаться в явном виде.

Применение объекта Image

Предварительно создадим графический файл (например, в формате GIF, PNG или JPG). При этом не важно, каково его содержимое, но желательно, чтобы изображение было возможно меньших размеров, например, 1x1 пиксел. Сохраним данный файл на сервере в той же папке, в которой находится (X)HTML-документ с элементами для ввода и отправки пароля. Графический файл сохраняем под некоторым именем, которое и будет паролем. Должно ли имя графического файла содержать расширение, зависит от Web-сервера. Надёжнее указывать расширение имени файла.

При загрузке страницы с предложением ввести пароль в текстовое поле (элемент <input type="password"/>) пользователь вводит набор символов, который присваивается атрибуту src объекта Image, если щелкнуть на кнопке OK. Если указанный таким образом графический файл существует, то он будет загружен в браузер, но не показан на странице. Далее остается проверить, равны ли ширина и высота загруженного изображения определенным величинам, например, 1 px. Мы можем проконтролировать, загружен ли указанный файл. Если он не загрузился, то следует считать, что пароль не верен. Даже если загрузка прошла успешно, но размеры изображения не равны заданным, то пароль также следует считать неверным.

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

На данной странице приведена форма для ввода пароля. Введите в качестве пароля слово mypassword.png и щелкните на кнопке ОК. В результате откроется страница с более подробным описанием парольной защиты.

Введите пароль:

Мы рассмотрели, так сказать, апокрифическое применение объекта Image. Возможно, для парольной защиты лучше использовать объект XMLHttpRequest.

Применение объекта XMLHttpRequest

Вместо графического файла на сервере можно хранить текстовый файл, содержащий свое имя. Имя файла и его содержимое являются паролем. В клиентском сценарии с помощью объекта XMLHttpRequest запрашивается текстовый файл, имя которого введено пользователем в поле, и при его получении дополнительно анализируется содержимое. Оно должно совпасть со словом, введенным пользователем, т.е. с именем файла. Разумеется, можно придумать и более хитрые варианты.

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