Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fherrerao/active_storage
https://github.com/fherrerao/active_storage
Last synced: 4 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/fherrerao/active_storage
- Owner: fherrerao
- Created: 2022-11-07T23:30:20.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2022-11-09T17:27:39.000Z (about 2 years ago)
- Last Synced: 2024-12-18T17:11:27.391Z (29 days ago)
- Size: 22.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Adjuntar imágenes con Active Storage en Rails 7
Active Storage es una herramienta de Rails que facilita el adjuntar archivos y almacenarlos ya sea de forma local (intranet) en tu ordenador o a plataformas en la nube como AWS, Google Cloud Storage, Microsoft Azure Storage, Digital Ocean, entre otros.
En este artículo se va a realizar un proyecto desde cero utilizando Scaffold que permite crear una estructura básica de Rails, teniendo como uno de sus atributos el adjuntar una imágen.
## Creando proyecto de libros
Se crea el proyecto utilizando PostgreSql como base de datos, para lo cual se ejecuta desde un terminal el siguiente comando:
~~~
rails new books_storage --database postgresql
~~~
## Utilizando Scaffold
Scaffold crea una estructura básica que permite administrar (mostrar, crear, eliminar y actualizar ) un libro, el mismo que tendrá los siguientes atributos: title, author, description, image, ejecutamos el siguiente comando:
~~~
rails new generate scaffold book title:string author:string description:string image:string
~~~
## Instalando Active Storage
Se lo puede instalar ejecutando el siguiente comando:
~~~
rails active_storage:install
~~~
Este comando va a generar una migración y creará una tabla donde se van a guardar las rutas de todos los archivos que se suban, no se guarda el archivo en si en la base de datos, este se va a 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
~~~
## Editando la clase Book
Se debe declarar los archivos que van a ir adjuntos al modelo de book, para ello se agrega:
~~~
class Book < ApplicationRecord
has_one_attached :image
end
~~~
_has_one_attached_ indica que el campo `image` del formulario tiene un archivo adjunto.
## Agregando 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:
~~~
<%= form.label :image, style: “display:block” %>
<%= form.file_field :image %>
~~~
## Cambiando la ruta raíz:
Se debe cambiar la ruta `root` con el fin de que se ejecute el la interacción de la clase libros que se acaba de crear para ellos se agrega en `config/route.rb`
~~~
root “books#index”
~~~
donde books hace referencia al controlador e index es la acción a ejecutar.
## Editando _book.html.erb
Para mostrar la imagen adjunta se puede hacer uso del helper `image_tag`, editando el campo correspondiente a la imagen quedaría de la siguiente manera:
~~~
Image:
<%= image_tag book.image, width: 200 if book.image.attached? %>
~~~
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 debe permitir el registro del campo `:image` con esto se generan los permisos para poder guardar la imágen.
## Probando la aplicación
Ejecutamos el servidor con:
~~~
rails server
~~~
para luego dirigirse a la dirección: `https://localhost:3000/books/new` se llena los campos del formulario y se adjunta una imagen disponible en el computador local, el registro del libro se debe realizar satisfactoriamente.
Una ves el formulario haya sido enviado, el nuevo registro de libro con su respectiva imagen debe 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 se probó su funcionalidad mediante el uso de un formulario básico.