flash란?

어떤 동작을 했을 때, 성공했는지, 혹은 실패했는지, 상대에게 알림 기능이 있으면 편리하네요.

Rails는 로그인시 "로그인했습니다"라고 표시하는 등 View에서 임시 메시지를 표시하기 위해 flash라는 해시 형식의 객체를 설정합니다.

이 플래시를 사용하면 다음 이미지 상단에 표시된 "메시지를 게시했습니다."와 같이 플래시 메시지를 표시 할 수 있습니다.



참고: flash - 참조 - - Rails 문서

그럼 보다 자세한 사용법을 살펴보겠습니다.
※View는 haml기법으로의 설명이 됩니다
※devise의 준비가 완료된 후의 순서가 됩니다

구체적인 사용 예

views/layouts/_flash.html.haml

- flash.each do |key, value|
  = content_tag(:div, value, class: "flash flash__#{key}")

devise를 도입한 상태에서 flash 객체를 사용하면, devise에 관한 통지(로그인·로그아웃등)가 발생했을 때만, key와 value의 해시를 생성해 줍니다.

flash에는 표준으로 notice(동작 성공시)와 alert(동작 실패시)의 2개의 키를 생성해 주기 때문에, 양쪽 모두에 적용할 수 있도록 each 메소드를 사용해 key와 value를 꺼내고 있습니다.

또한 content_tag는 HTML 태그를 생성할 수 있으며 첫 번째 인수에는 태그, 두 번째 인수에는 내용, 세 번째 인수에는 옵션(예: 클래스)을 설정합니다.

이번, 표시하고 싶은 것은 value이므로, 제2 인수에 value를 설정하고 있습니다.

또, class에 flash와 flash__#{key}의 2개를 설정하는 것으로, key가 notice일 때와 alert일 때 scss의 표시를 바꿀 수가 있습니다.

SCSS 견본 예

app/assets/stylesheets/modules/_flash.scss

.flash {
  color: $white;
  text-align: center;
  &__alert{
    background-color: red;
  }
  &__notice {
    background-color: $blue;
  }
}

주의점으로서는, class가 flash_#{key}만이라면 flash 클래스에 기술한 내용(이 경우는 color와 text-align)이 반영되지 않습니다. 따라서 class: "flash flash_#{key}"와 2개의 클래스를 설정합시다.

플래시 메시지의 설치 장소

views/layouts/application.haml

!!!
%html
  %head
   省略
  %body
  = render 'layouts/flash'
  = yield

첫 번째 견본 이미지와 같이 모든 요소 위에 표시하려면 layouts/application.haml에 기술하면 좋을 것 같습니다.

다만, 여기에 기술하면(자) 수정시에 다소 어렵기 때문에, 나는 부분 템플릿 _flash.haml 에 잘라서, render 메소드로 호출하도록(듯이) 했습니다.

devise의 일본어화

devise.ja.yml을 config/locales에 설치합니다. 몇 가지 견본이 있는 것 같아서 그 중 하나를 소개합니다.
devise.ja.yml

또한 이것을 로드하는 설정을 해야 합니다.

config/application.rb

module ChatSpace
  class Application < Rails::Application
    config.i18n.default_locale = :ja
  end
end

이상으로 devise를 플래시 메시지를 표시할 수 있습니다.

flash 메시지 편집

컨트롤러에서 플래시를 설정하면 모든 동작 후에 플래시 메시지를 표시할 수 있습니다.

예를 들어, 그룹 작성 성공 및 실패 시 플래시 메시지를 표시합니다.

groups_controller.rb

  def create
    @group = Group.new(group_params)
    if @group.save
      redirect_to root_path, notice: "グループを作成しました"
    else
      flash.now[:alert] = "グループ名を入力してください"
      render :new
    end
  end

전제로, group 모델에서 validates :name, presence: true 와 같이 검증을 기술하고 있기 때문에, name 가 없는 경우는 저장할 수 없게 되어 있습니다.

따라서, @group 가 「저장할 수 있었던 경우」와 「저장할 수 없었던 경우」로 조건 분기해, flash 메세지를 표시하도록(듯이) 했습니다.
flash[:notice] = "表示したい内容" 와 같이 기술하는 것으로, flash 오브젝트의 notice 키의 밸류를 설정할 수 있습니다.

flash와 flash.now의 차이는 아래를 확인하십시오. 기본적으로 flash.now를 사용하면 좋을 것 같습니다.

[rails] flash와 flash.now의 차이점

마지막으로

필자의 지식 부족에 의한 실수가 있으면, 지적을 주시면 도움이 됩니다.