← Назад в «Блог»
23 869

Доступ на сайт по паролю. 5 строк кода

В этот статье поговорим о том, как сделать доступ к сайту или отдельной директории по паролю.

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

.htaccess — файл дополнительной конфигурации веб-сервера Apache.
.htpasswd
— файл для указания логинов и паролей для доступа.

Расположение этих файлов будет зависеть от того, к какой директории вы хотите закрыть доступ.

Закрыть доступ ко всему сайту

Файл .htaccess должен находится в корневой папке сайта, .htpasswd лучше положить в какую-то из директорий, чтобы до него нельзя было так просто добраться — там будут лежать логины и пароли для доступа. Предлагаю положить его в директорию /folder.

Получается такая структура:

Доступ на сайт по паролю. 5 строк кода 1

В файл. htaccess вставляем код:

AuthType Basic
AuthName "Protected Area"
AuthUserFile /.htpasswd
Require valid-user

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

AuthType — типы аутентификации: Basic или Digest. Рекомендуется использовать первый, т.к. второй поддерживается не всеми браузерами.

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

require valid-user — директива предписывает, что к URL получают доступ только, пользователи, успешно прошедшие аутентификацию.

В строке AuthUserFile вставляете путь, который получился у вас в файле test. php

Для того чтобы узнать абсолютный путь к файлу, создаем в директории с файлом .htpasswd файл test.php, в нем экранируем переменную:

<?php echo dirname($_SERVER['SCRIPT_FILENAME']);

Теперь нам нужно открыть этот файл в браузере.
http://ваш-сайт.ru/folder/test.php, подставите адрес своего сайта.


У меня на выходе получилась такая строка
/home/***/works/sneakers-html/folder

Вставляем ее в код и получаем:

AuthType Basic
AuthName "Protected Area"
AuthUserFile /home/***/works/sneakers-html/folder/.htpasswd
Require valid-user

После того как вы узнали абсолютный путь до директории, удалите этот файл, он больше не нужен.

Теперь нам нужно создать зашифрованный пароль. Для этого перейдем по ссылке на генератор паролей.

Заполняем необходимые данные в форме и нажимаем кнопку «сгенерировать данные»:

Доступ на сайт по паролю. 5 строк кода 2

Скопируем получившуюся строку и вставим в файл. htpasswd:

Доступ на сайт по паролю. 5 строк кода 3
содержимое файла. htpasswd

Строка означает — логин: пароль в зашифрованном виде. Для доступа на сайт нам нужно вводить тот логин и пароль, который мы указывали в генераторе, то есть admin и password.

Что мы имеем в итоге:

  • файл .htaccess лежащий в корне сайта с 4 строками кода и путем к файлу с логинами и паролями
  • файл .htpasswd с логином и паролем

Теперь мы можем заходить на сайт и должны увидеть такое окно:

Доступ на сайт по паролю. 5 строк кода 4
Форма для ввода логина и пароля

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

Закрыть доступ к директории

Разница между этими способами в том, что файл. htaccess нужно поместить в ту директорию, которую вам необходимо закрыть:

Доступ на сайт по паролю. 5 строк кода 5

Файл .htaccess вы можете разместить в любом месте, вы уже научились узнавать его абсолютный путь. В данном случае можно просто скопировать путь из файла. htaccess корневой папки.

Будьте внимательны
Любое несоответствие кода в .htaccess или неправильный путь до файла приведут к ошибке «500 Internal Server Error». Если это произошло — сверяйте код в файле .htaccess

У меня выкидывало ошибку из-за отсутствия «/» в начале пути.

Видеоурок


Спасибо за прочтение статьи! Если у вас возникнут какие-то вопросы, трудности, пишите мне на почту, в личку в вк, в комментариях, по возможности помогу!

Итоговый код файлов

.htaccess

AuthType Basic
AuthName "Protected Area"
AuthUserFile /home/***/works/sneakers-html/folder/.htpasswd
Require valid-user

.htpasswd, логин и пароль. Генерировать тут. В коде пример рандомного логина и пароля

postnov:XVLbicy4CMxUE

Примечания

Если нужно, чтобы пароль запрашивался каждый раз и его нельзя было его «запомнить». Вставьте в файл htaccess строку AuthBasicProvider file.

Полезно
40
1
Непонятно
29
Поделиться
Отправить
Линкануть
Вотсапнуть

Канал о фрилансе

Там я делюсь фишками о фрилансе: деньги, клиенты, автоматизация, фриланс. Раньше это был закрытый материал с платным доступом. Сейчас он открыт. Иногда подписчикам будет открываться платные материалы. Подписаться

← Назад в «Блог»

15 комментария

Спасибо за понятный скрипт и объяснения

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

Добрый день. Хорошая статья, большое спасибо.

Быть можете подскажите каким образом реализовать открытие нужного таба при клике на ссылку.

site.ru/#tab-1 — при переходе откроется первый таб

site.ru/#tab-2 — при переходе откроется второй таб

Учитывая то, что табы на этой же странице, можно в href оставить только #tab-1.

Если так, что вы просто достаёте из атрибута href значения и ищете контейнеры с data-tab=»#tab-1″.

<a href=»#tab-1″>tab</a>

<div data-tab=»#tab-1″>container</div>

Можно же вообще обойтись без JS и сделать то же самое на чистом CSS с помощью radio:checked

Как сделать что-бы выбранная вкладка, не сбрасывалась после перезагрузке странице , на исходную вкладку ? а оставалась на выбранной кладке ???

Хорошее решение, но так же интересует возможность размещение несколько табов на страницу на jquery!

Спасибо за статью!
Можете дать ссылку для пояснения вот этого обращения .js-tab-content[data-tab=»‘+id+'»]?

спасибо большое! ваш код здорово меня выручил!

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *