В этот статье поговорим о том, как сделать доступ к сайту или отдельной директории по паролю.
В чем суть: мы создадим 2 файла: в первом код для блокировки сайта с ссылкой на 2 файл, в котором лежат логины и пароли для доступа. В первом файле мы должны указать абсолютный путь до второго:
.htaccess — файл дополнительной конфигурации веб-сервера Apache.
.htpasswd — файл для указания логинов и паролей для доступа.
Расположение этих файлов будет зависеть от того, к какой директории вы хотите закрыть доступ.
Закрыть доступ ко всему сайту
Файл .htaccess должен находится в корневой папке сайта, .htpasswd
лучше положить в какую-то из директорий, чтобы до него нельзя было так просто добраться — там будут лежать логины и пароли для доступа. Предлагаю положить его в директорию /folder.
Получается такая структура:
В файл. 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
После того как вы узнали абсолютный путь до директории, удалите этот файл, он больше не нужен.
Теперь нам нужно создать зашифрованный пароль. Для этого перейдем по ссылке на генератор паролей.
Заполняем необходимые данные в форме и нажимаем кнопку «сгенерировать данные»:
Скопируем получившуюся строку и вставим в файл. htpasswd:
Строка означает — логин: пароль в зашифрованном виде. Для доступа на сайт нам нужно вводить тот логин и пароль, который мы указывали в генераторе, то есть admin и password.
Что мы имеем в итоге:
- файл .htaccess лежащий в корне сайта с 4 строками кода и путем к файлу с логинами и паролями
- файл .htpasswd с логином и паролем
Теперь мы можем заходить на сайт и должны увидеть такое окно:
После ввода данных на откроется главная страница сайта. Если же будет ошибка в вводимых данных, либо мы получим 404 ошибку, либо страница перезагрузится и снова появится форма ввода данных.
Закрыть доступ к директории
Разница между этими способами в том, что файл. htaccess нужно поместить в ту директорию, которую вам необходимо закрыть:
Файл .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
.
Канал о фрилансе
Там я делюсь фишками о фрилансе: деньги, клиенты, автоматизация, фриланс. Раньше это был закрытый материал с платным доступом. Сейчас он открыт. Иногда подписчикам будет открываться платные материалы. Подписаться
15 комментария
Хороший скрипт! Спасибо!
Спасибо за понятный скрипт и объяснения
спасибо за статью, помогите справиться с проблемой размещения двух табов на одной странице. работает только первый
Пожалуйста. Можете написать мне вконтакте или в телеграм?
— https://vk.com/postnov_daniil
— @daniilpostnov
Там мне будет удобнее отвечать на ваш вопрос.
Добрый день. Хорошая статья, большое спасибо.
Быть можете подскажите каким образом реализовать открытие нужного таба при клике на ссылку.
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
Можно, не спорю, но это реализация на js. Я думаю тут больше гибкости.
Как сделать что-бы выбранная вкладка, не сбрасывалась после перезагрузке странице , на исходную вкладку ? а оставалась на выбранной кладке ???
Спасибо!
Доработаю и обновлю статью.
Спасибо огромное!
Как всегда выручаешь такими простыми решениями!
Хорошее решение, но так же интересует возможность размещение несколько табов на страницу на jquery!
Спасибо!
Освобожусь и обазятальено допишу.
Спасибо за статью!
Можете дать ссылку для пояснения вот этого обращения .js-tab-content[data-tab=»‘+id+'»]?
спасибо большое! ваш код здорово меня выручил!