I am currently attending a programming school and have moved to the portfolio production phase. I wanted to make something like Instagram Stories that allows me to post short videos, but I was worried that there were fewer articles to upload videos than I expected, so I will write it so that I will not forget this time.
-[Rails 5.2] How to use Active Storage -I made a video posting site using Active Storage
Initially, I was thinking of implementing it using Carrierwave etc., but when I investigated it, it seems that file upload can be done with the standard function of Rails, so I will implement it here. I'm a beginner who knows ActiveStorage today, so please check other people's articles for details. I will leave the flow up to video posting. This is a quote from a reference site.
A function added in Rails 5.2 for uploading files. If you use this, you can easily create an image posting function etc. with a form. You can also easily upload files to cloud storage services such as Amazon S3, Google Cloud Storage, and Microsoft Azure Storage. In addition to cloud storage, you can also save files to your local disk.
$ rails active_storage:install
$ rails db:migrate
Two tables are created, ʻactive_storage_blobs and ʻactive_storage_attachments
.
These two will continue as they are.
This time, I will simply make a model called Video
.
I created title
and ʻintroduction` in the column.
I haven't created a column for the video itself here.
$ rails g resource video title:string introduction:text
$ rails db:migrate
This time, we will assume that you can post one video at a time.
Write has_one_attached
in the Video
model.
/app/models/video.rb
class Video < ApplicationRecord
has_one_attached :video
end
: video
is the name of the file, and it seems that you can give it any name you like. (If you upload an image, such as : image
)
I will write it in the videos controller.
/app/controllers/videos_controller.rb
class VideosController < ApplicationController
def new
@video = Video.new
end
def create
@video = Video.new(video_params)
@video.create
redirect_to @video
end
def show
@video = Video.find(params[:id])
end
private
def video_params
params.require(:video).permit(:title, :introduction, :video)
end
end
The Video
model does not have a: video
column, but this corresponds to has_one_attaches: video
.
This time it's a test to see if you can post a video, so only new create show is written.
Write the post form with new.
/app/views/videos/new.html.erb
<%= form_with model: @video, local: true do |form| %>
<p>title</p><%= form.text_field :title %> <br>
<p>introduction</p><%= form.text_area :introduction %> <br>
<p>video</p><%= form.file_field :video %> <br>
<%= form.submit %>
<% end %>
I think that the posting form was created like this. We will also create a show page.
/app/views/videos/show.html.erb
<% if @video.video.attached? %>
<p><%= @video.title %></p> <br>
<p><%= @video.introduction %></p>
<%= video_tag rails_blob_path(@video.video) %>
<% end %>
You can check if @video has video with .attached?
.
If you simply write <% = video_tag @ video.video%>
, it seems that you are looking for data in the direction of / app / assets /
, and you will get an error in the asset pipeline.
Let's write rails_blob_path
.
It is now displayed. The video will not play if it is left as it is. Write <% = video_tag%>
in <video>
.
/app/views/videos/show.html.erb
<% if @video.video.attached? %>
<p><%= @video.title %></p> <br>
<p><%= @video.introduction %></p>
<video src="<%= rails_blob_path(@video.video) %>" type="video/mp4" controls></video>
<% end %>
controls
automatically creates an interface that makes the video easier to use.
Now you can upload, display, and even play the video.
I'm not actually making columns, so I'm about to list them, but will it work? I will post if something happens again.
Since this time we are creating a portfolio, it is assumed that the video will be free material and short, about a few seconds, considering the deployment. Long videos are large in size, so if you try to do it locally or on the network, it will be great. (School people were warned to keep it to the minimum necessary) There is a usage fee, but there seems to be a method such as using AWS S3 (although I am not familiar with this area yet) I hope that if you are a beginner like yourself, you will think that there is such a method.
Recommended Posts