Railsでログインを押すとログアウトに表示を変更する方法

Railsでログインを押すとログアウトに表示を変更する方法

今回はRuby on Railsでログイン機能を実装します！
ログイン機能を実装しようとすると、ログイン・ログアウト・新規登録のボタンが3つできるかもしれません。今回は3つできるボタンを2つで実装し、ログインボタンを押したらログアウトと表示できるようにしていきたいと思います！(イメージは以下の動画です)

注意
この記事は、すでにログイン・ログアウト・新規登録の実装ができていることを前提に書いています。

目次

1.View周り
2.コントローラー設計
3.ルート周り

View周り

まず、ビューページのどこかに以下のようにログイン・ログアウト・新規登録のボタンを実装しているかもしれません。

tweets/index.html.erb

  <%= link_to "ログイン", tweets_path %>
  <%= link_to "新規登録", new_user_registration_path %>
  <%= button_to 'ログアウト', destroy_user_session_path, method: :delete %>

しかしWebサイトでは、ログイン機能はほとんどヘッダーに実装されることが多いボタンになります。そこで、今回はヘッダーに書いてみましょう！
また、今回はif文を使用していくので以下のようにビューページを編集します。

layouts/application.html.erb

<% if user_signed_in? %>
    <a href="/users/sign_out" data-method="delete" class="button1">
        <span class="button1__text">Log out</span>
    </a>
<% else %>
    <a href=" /users/sign_in.html" class="button1">
        <span class="button1__text">Log in</span>
    </a>
<% end %>
    <a href=" /users/sign_up.html" class="button1">
        <span class="button1__text">Sign up</span>
    </a>

コントローラー設計

次にコントローラーを作成します。

コマンド

rails g controller users

作成したコントローラーに以下を書きます。

users_controller.rb

class UsersController < ApplicationController
    def test_destroy
        delete destroy_user_session_path
        @request.env["devise.mapping"] = Devise.mappings[:user] 
        assert_response :success
    end
end

ルート周り

最後にルートを書きます。
devise_for :usersの下に書くといいと思います！

routes.rb

  devise_scope :user do
    get '/users/sign_out', to: 'devise/sessions#destroy'
    delete '/users/sign_out', to: 'devise/sessions#destroy'
  end

以上です！