Active Storage en Rails 7

Active Storage es una herramienta de Rails que facilita adjuntar archivos y almacenarlos ya sea de forma local (intranet) en tu ordenador o en plataformas en la nube como AWS, Google Cloud Storage, Microsoft Azure Storage y Digital Ocean, entre otras.

En este artículo realizaremos un proyecto desde cero utilizando Scaffold, el cual permite crear una estructura básica de Rails, teniendo adjuntar una imagen como una de sus funcionalidades.

Paso 1: Crear un proyecto de libros

Utilizaremos PostgreSQL como base de datos, para lo cual se ejecuta desde un terminal el siguiente comando:

~~~

rails new books_storage --database postgresql

~~~

Paso 2: Scaffold

Scaffold crea una estructura básica que permite administrar (mostrar, crear, eliminar y actualizar) un libro, mismo que tendrá los siguientes atributos: title, author, description, image, etc. Aquí ejecutamos el siguiente comando:

~~~

rails new generate scaffold book title:string author:string description:string image:string

~~~

Paso 3: Instalar Active Storage

Se puede hacerlo a través del siguiente comando:

~~~

rails active_storage:install

~~~

Este comando generará una migración y creará una tabla donde se guardarán las rutas de todos los archivos que se suban. No se guarda el archivo en sí en la base de datos, sino que almacenará en el disco duro, si se trabaja de forma local, o en un almacenamiento en la nube si se lo lleva a producción.

Se crea la base de datos con:

~~~

rails db:create

~~~

Posteriormente, se generan las migraciones:

~~~

rails db:migrate

~~~

Paso 4: Editar la clase Book

Se deben declarar los archivos que irán adjuntos al modelo de book, para lo cual se agrega:

~~~

class Book < ApplicationRecord

has_one_attached :image

end

~~~

_has_one_attached_ indica que el campo image del formulario tiene un archivo adjunto.

Paso 5: Agregar el campo image en la vista

Abrimos el archivo _form.html.erb que se encuentra en el path: app/views/books/_form.html.erb se edita el campo correspondiente a la imagen cambiando del tipo text_field a file_field, quedando:

~~~

<div>

<%= form.label :image, style: “display:block” %>

<%= form.file_field :image %>

</div>

~~~

Paso 6: Cambiar la ruta raíz

Se debe cambiar la ruta root con el fin de que se ejecute la interacción de la clase libros que se acaba de crear. Para ello, se agrega en config/route.rb.

~~~

root “books#index”

~~~

donde books hace referencia al controlador e index es la acción a ejecutar.

Paso 7: Editar _book.html.erb

Para mostrar la imagen adjunta se puede hacer uso del helper image_tag. Al editar el campo correspondiente a la imagen quedaría de la siguiente manera:

~~~

<p>

<strong>Image:</strong>

<%= image_tag book.image, width: 200 if book.image.attached? %>

</p>

~~~

La imagen está lista para ser mostrada y debe tener un ancho de 200px. El condicional después del 200 es para verificar si existe alguna imagen adjunta, evitando que se rompa la aplicación al querer mostrar una imagen no existente.

Como dato adicional, se debe asegurar que dentro de books_controller en el método `book_params` se permita el registro del campo `:image`, con lo que se generan los permisos para poder guardar la imagen.

Paso 8: Probar la aplicación

Ejecutamos el servidor con:

~~~

rails server

~~~

para luego dirigirnos a la dirección https://localhost:3000/books/new. Se llenan los campos del formulario y se adjunta una imagen disponible en el computador local. Tras esto, el registro del libro se debe realizar satisfactoriamente.

Una vez enviado el formulario, el nuevo registro de libro con su respectiva imagen debería ser mostrada.

En resumen

Active Storage facilita y reduce la cantidad de código que se utiliza para administrar imágenes adjuntas.

En este corto artículo se realizó la configuración de Active Storage con Rails 7, además de probar su funcionalidad mediante el uso de un formulario básico.