혼잣말 앱을 만들어 보세요 ④

이미지 투고 기능을 구현합니다.
이미지를 업로드할 때 이미지의 저장, 표시, 크기를 조정해야 합니다.
Rails의 활성 스토리지 기능을 사용합니다.
몇 가지 기능을 설치하러 갈게요.
이미지 작업에 필요한 ImageMagick이라는 이미지 변환 도구와 Rails에서 사용하는 Gem을 설치해야 합니다.
ImageMagick은 Gem이 아니라 소프트웨어이므로 Homebrew에서 설치합니다.
Gem이 아닌 Ruby 또는 Rails에서 ImageMagick을 처리하려면 MiniMagick이라는 Gem이 필요합니다.
MiniMagick에서는 Rails에서 ImageMagick 기능을 사용할 수 있지만 이미지 크기를 변경하려면 ImageProcessing이라는 Gem을 추가해야 합니다.
순서대로 하세요.

% brew install imagemagick  #imagemagickをインストール

Gem 설치

Gemfile

gem 'mini_magick'
gem 'image_processing', '~> 1.2'

% bundle install

그런 다음 활성 스토리지를 사용하도록 설치합니다.

rails active_storage:install

우리 이식하자.

% rails db:migrate

테이블이 추가되었습니다.

활성 메모리 테이블에서 이미지 저장을 실현합니다.
단계는 다음과 같습니다.
① 활성 메모리 테이블과 Tweets 테이블의 관련 정의
②tweets_controller.rb에 이미지 열 저장 허용

has_one_attached 방법

모든 기록과 파일을 일대일 관계로 연결하는 방법.
has_one_attached 방법을 설명하는 모델의 모든 기록에 파일을 추가할 수 있습니다.

class モデル < ApplicationRecord
  has_one_attached :ファイル名
end

Tweet 모델을 작성합니다.
app/models/tweet.rb

class Tweet < ApplicationRecord
  has_one_attached :image
end

그림을 추가하여 획 매개변수에 저장할 수 있습니다.
app/controllers/tweets_controller.rb

private
  def tweet_params
    params.require(:tweet).permit(:name,:text,:image)
  end

다음에 저장된 이미지를 표시합니다.

image_tag 방법

자세한 내용을 확인한 후
모델에서 이미지 파일을 호출하고 매개 변수에 기술하기만 하면 이미지를 표시하는img 요소를 생성할 수 있습니다.

attached?방법

기록이 첨부되었는지에 따라 진짜나 가짜로 돌아가는 방법

モデル.ファイル名.attached?

variant 방법

이것은 활성 저장소를 배치할 때 사용할 수 있는 방법이다.
를 사용하여 파일의 표시 크기를 지정할 수 있습니다.

モデル.ファイル名.variant(resize: '幅x高さ')

뷰 파일을 변경합니다.
app/views/messages/_message.html.erb

<div class="contents row">
  <% @tweets.each do |tweet| %>
    <div class="content_post" >
      <p><%= tweet.text %></p>
       <p><%= image_tag tweet.image.variant(resize: '500x500'), class: 'tweet-image' if tweet.image.attached?%></p>
      <span class="name">
        <%= tweet.name %>
      </span>
    </div>
  <% end %>
</div>

app/models/tweet.rb

class Tweet < ApplicationRecord
  has_one_attached :image

  validates :text, presence: true, unless: :was_attached?
  def was_attached?
    self.image.attached?
  end
end

validates의 unless 옵션에서 방법 이름을 지정합니다
'방법의 반환값이false이면 검증을 통해 검증한다'는 조건을 제정했다.
지정한was_attached?방법은 self입니다.image.attached?의 기술
그림이 있으면 진짜로 돌아가고, 없으면 가짜로 돌아갑니다.
따라서 이미지가 없으면 텍스트가 필요하고 이미지가 있으면 텍스트가 필요하지 않습니다.
사진을 게시하다.
(확장자가 ".png"또는 ".jpeg"인 그림을 게시하십시오.)
아래의 행동이라면 성공이다.