Лаб. работа “Работа с медиа контентом в Symfony”

Разработка web-приложений с использованием программных платформ
Практика
Автор

Бизюк Андрей

Дата публикации

29 февраля 2024 г.

В этой лабораторной работе мы изучим, как работать с медиа контентом в Symfony. Для этого мы создадим простое приложение, которое будет позволять пользователям загружать изображения и отображать их на странице.

Шаг 1: Установка необходимых пакетов

Для работы с медиа контентом в Symfony нам понадобятся следующие пакеты:

  • Symfony Form
  • Symfony Validator
  • Symfony FileLoader
  • Doctrine ORM

Установите эти пакеты, используя Composer:

composer require symfony/form
composer require symfony/validator
composer require symfony/file-loader
composer require doctrine/orm

Шаг 2: Создание сущности Image

Создайте новую сущность Image, используя команду Doctrine:

php bin/console make:entity Image

Задайте поля для сущности Image:

  • id (integer, primary key, auto-increment)
  • name (string, length 255)
  • path (string, length 255)
  • createdAt (datetime)
  • updatedAt (datetime)

Создайте миграцию и обновите базу данных:

php bin/console make:migration
php bin/console doctrine:migrations:migrate

Шаг 3: Создание формы загрузки изображений

Создайте новую форму загрузки изображений, используя команду Symfony:

php bin/console make:form ImageType

Задайте поля для формы ImageType:

  • image (FileType, required)

Измените конфигурацию формы, чтобы она использовала сущность Image:

public function buildForm(FormBuilderInterface $builder, array $options): void
{
    $builder
        ->add('image', FileType::class, [
            'required' => true,
            'label' => 'Select an image',
        ])
    ;
}

public function configureOptions(OptionsResolver $resolver): void
{
    $resolver->setDefaults([
        'data_class' => Image::class,
    ]);
}

Шаг 4: Создание контроллера для работы с изображениями

Создайте новый контроллер, используя команду Symfony:

php bin/console make:controller ImageController

Добавьте действие для загрузки изображений:

/**
 * @Route("/images/upload", name="image_upload")
 */
public function upload(Request $request, EntityManagerInterface $entityManager): Response
{
    $image = new Image();
    $form = $this->createForm(ImageType::class, $image);
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        $file = $form['image']->getData();
        $fileName = md5(uniqid()).'.'.$file->guessExtension();
        $file->move($this->getParameter('images_directory'), $fileName);
        $image->setName($fileName);
        $image->setPath($this->getParameter('images_directory'));
        $entityManager->persist($image);
        $entityManager->flush();

        return $this->redirectToRoute('image_index');
    }

    return $this->render('image/upload.html.twig', [
        'form' => $form->createView(),
    ]);
}

Добавьте действие для отображения списка изображений:

/**
 * @Route("/images", name="image_index")
 */
public function index(EntityManagerInterface $entityManager): Response
{
    $images = $entityManager->getRepository(Image::class)->findAll();

    return $this->render('image/index.html.twig', [
        'images' => $images,
    ]);
}

Шаг 5: Создание шаблонов

Создайте шаблон для формы загрузки изображений:

{% extends 'base.html.twig' %}

{% block body %}
    <h1>Upload an image</h1>

    {{ form_start(form) }}
        {{ form_row(form.image) }}
        <button type="submit">Upload</button>
    {{ form_end(form) }}
{% endblock %}

Создайте шаблон для отображения списка изображений:

{% extends 'base.html.twig' %}

{% block body %}
    <h1>Images</h1>

    <ul>
        {% for image in images %}
            <li>
                <img src="{{ asset('uploads/' ~ image.name) }}" alt="{{ image.name }}" width="200">
            </li>
        {% endfor %}
    </ul>
{% endblock %}

Шаг 6: Тестирование приложения

Запустите приложение и перейдите по адресу /images/upload. Загрузите несколько изображений и убедитесь, что они отображаются на странице /images.

Дополнительные материалы:

Наверх