Чат PHP-разработчиков
Фотоальбом на PHP: онлайн урок

Пишем фотоальбом на PHP

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

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

Мы будем расширять уже созданную нами ранее систему авторизации, её исходный код до начала изменений вы можете скачать тут.

Создадим также файл upload.php из прошлого урока и папку upload. Должно получиться вот так.

Загружать картинки может только авторизованный пользователь

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

Код доступен только после покупки курса PHP для начинающих.

Этим мы просто не допустим загрузку файла на сервер. Помимо этого в upload.php нужно неавторизованному пользователю вообще не показывать форму для загрузки файлов. Проще простого, добавляем ещё одно условие:

Код доступен только после покупки курса PHP для начинающих.

Отлично, теперь загружать файлы можно только после логина.

Список фотографий

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

Для начала давайте загрузим с помощью upload.php несколько фоток. Я взял картинки с котиками, назвал их 1.jpg, 2.jpg, 3.jpg и загрузил их через формочку. После этого они появились в папке uploads.

Фотки после загрузки на сервер

Так как наши фоточки сохраняются в папку uploads, то из неё и будем формировать наш список.
В домашнем задании к одному из прошлых уроков вы должны были познакомиться с функцией scandir(). Она возвращает список файлов в директории в виде массива.

Давайте запишем в файл index.php следующий код:

Код доступен только после покупки курса PHP для начинающих.

Теперь запустим скрипт в браузере и увидим следующее:

Файлы в папке uploads

. и .. – это текущая директория и родительская директория соответственно. А вот всё остальное – это наши файлы.

Давайте сформируем список ссылок на наши картинки. Пройдёмся по массиву с именами файлов и приклеим перед их именами текст http://myproject.loc/uploads/, а ещё нам нужно проигнорировать папки . и ...

Код доступен только после покупки курса PHP для начинающих.

Теперь в $links лежат прямые ссылки на все наши загруженные картинки.

Ссылки на загруженные картинки

Остаётся только вывести превьюшки!

Код доступен только после покупки курса PHP для начинающих.

Полюбуемся на результат.

Вывод фоток в альбоме

Остаётся только добавить ссылки, чтобы при клике на картинки открывалась исходная фоточка.

Код доступен только после покупки курса PHP для начинающих.

Вот и всё! Полный исходный код текущего состояния доступен здесь. А изменения, которые были произведены в данном уроке, можно наглядно рассмотреть вот здесь.

Читайте также
Комментарии (6)


Fox-24

Очень здорово!) Спасибо!)

ivashkevich

На здоровье =)

ArtemijeKA

Спасибо за урок! Хотелось бы видеть на каждом уроке такие ссылки https://github.com/ivashkevitch/php-training-course/commit/50081a71c59feb80687e2a6eaf4a4e1fce041539
чтобы можно было задать прямо там вопрос по конкретной строке, и я думаю возможо, что все обучающиеся видели бы комментарии там и ответы по любой из строки кода. Как такой вариант?

П.С. А домашки не будет?)

ivashkevich

Ок, учту. Домашку что-то лень было придумывать - итак нормально уже все работает =) Если есть идеи - предлагайте.

AxLT

скопировал исходники получаю ошибку
Fatal error: Uncaught TypeError: Return value of getUserLogin() must be of the type string, null returned in C:\OSPanel\domains\myproject.loc\www\auth.php on line 21

ivashkevich
function getUserLogin(): ?string

точно стоит вопрос перед string?

Популярное за сутки
Сейчас читают
Логические задачи с собеседований