分からないこと

railsでdeviseというgemをインストールし作成したUserモデルを使用し、ユーザのログイン/ログアウト機能を実現したいと考えております。しかし、ログアウトボタンを押すと、ルーティングの際にgetメソッドが呼ばれているようで、そんな画面はないとエラーが出ています。解決策が分からないので質問させていただきました。

エラー内容

Routing Error
No route matches [GET] "/users/sign_out"

関連ソース

ERB
1<%# _header.html.erb %>
2<nav class="navbar navbar-default">
3  <div class="container">
4    <div class="navbar-header">
5      <button type="button" class="navbar-toggle collapseddata-toggle="collapse" data-target="#navigation">
6        <span class="icon-bar"></span>
7        <span class="icon-bar"></span>
8        <span class="icon-bar"></span>
9      </button>
10      <%# deviseでヘルパーとして追加されたuser_signed_in?メソッドを使用する %>
11      <% if user_signed_in? %>
12        <a class="navbar-brand" href="/">ブログ</a>
13        <%= link_to '新規作成', new_article_path %>
14        <%= link_to 'ログアウト', destroy_user_session_path, method: :delete %>
15      <% else %>
16        <a class="navbar-brand" href="/">新規ユーザさんのページ</a>
17        <%= link_to 'ユーザ登録', new_user_registration_path %>
18        <%= link_to 'ログイン', new_user_session_path %>
19      <% end %>
20    </div>
21    
22    <%# 右側に表示するログインユーザの名前 %>
23    <div class="collapse navbar-collapse" id="navigation">
24      <p class="navbar-text navbar-right"></p>
25  </div>
26</nav>

ERB
1<%# application.html.erb %>
2<!DOCTYPE html>
3<html>
4  <head>
5    <title>Blog</title>
6    <%= javascript_pack_tag 'application' %>
7    <%= csrf_meta_tags %>
8    <%= csp_meta_tag %>
9    <%= stylesheet_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
10    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
11    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
12  </head>
13
14  <body>
15
16    <%= render 'layouts/header'%>
17
18  <%# 新規登録やログイン時にメッセージ表示 %>
19  <p class="notice"><%= notice %></p>
20  <p class="alert"><%= alert %></p>
21
22    <%= yield %>
23  </body>
24</html>

Ruby
1# Routes.rb
2Rails.application.routes.draw do
3  devise_for :users
4  resources :articles
5  root 'articles#index'
6
7  # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
8end

javascript
1// application.js
2// This file is automatically compiled by Webpack, along with any other files
3// present in this directory. You're encouraged to place your actual application logic in
4// a relevant structure within app/javascript and only use these pack files to reference
5// that code so it'll be compiled.
6
7require("@rails/ujs").start()
8require("turbolinks").start()
9require("@rails/activestorage").start()
10require("channels")
11
12
13// Uncomment to copy all static images under ../images to the output folder and reference
14// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
15// or the `imagePath` JavaScript helper below.
16//
17// const images = require.context('../images', true)
18// const imagePath = (name) => images(name, true)
19
20// Bootstrapのための追記
21import 'bootstrap';
22import '../stylesheets/application';
23
24

実施してみたこと

deviseを使うのに参考にした記事

deviseの使い方（rails4版）

no1knows

2020/02/11 11:14

ログイン・ログアウトボタンに該当するコードを追記ください。（application.html.erbとか？）念の為、routes.rbも追記ください。質問はマークダウンを利用して、リンクも設定をお願いします。またリンク切れのページは修正をお願いします。

T.Adams

2020/02/11 12:31

ご返信ありがとうございます。追記しました。

no1knows

2020/02/11 14:02

application.jsも追記いただけますか？

T.Adams

2020/02/12 09:22

返答が遅くなり大変申し訳ありません。追記させていただきました。

行動規範の内容に同意します

回答1件

ベストアンサー

追記です。

こちらの解決策は、ログアウトボタンを下記のように変更することだったようです。

<%= link_to 'ログアウト', destroy_user_session_path, method: :delete %>
↓
<%= button_to 'Exit', destroy_user_session_path, method: :delete %>

調べたところ、button_toヘルパーはフォームを作成するそうです。

button_toヘルパーとlink_toヘルパーは、ほとんど同じような動作をさせることができます。
しかし、生成されるHTMLはまったく違っていますので、注意が必要です。
link_toヘルパーは、「Edit」の部分であるaタグを使ったリンクが生成されています。しかし、それに比べて、button_toヘルパーは、フォームが生成されて、その中にボタンが設置されているのです。

https://web-camp.ioの下の方にある「button_toヘルパーはフォーム」より抜粋

結論として、link_toだとページ遷移を行っているだけ、button_toだとdestroyアクションを実行しているという違いがあるようです。

最初の回答

公式のissueを確認したところDeviseを利用しているとたまに遭遇する問題で、原因は主にrails-ujsが読み込まれていないことのようです。
https://github.com/heartcombo/devise/issues

T.Adamsさんの場合は、application.jsにrails-ujsの設定があったので大丈夫そうでしたが、application.html.erbの<head>内の書き方が気になりましたので、下記を試してみて下さい。

<!-- application.html.erbのヘッダーの中身を置き換える-->
  <head>
    <title>Blog</title>
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

具体的な説明としては、<%= javascript_pack_tag 'application' %>という書き方だとTurbolinksを考慮していない状態でJavascriptを読み込んでいるため、rails-ujsがきちんと動いていない可能性があるためです。
（すいません。ここらへんはあまりきちんと理解できていないのであくまで想定となります。）

参考：対処方法がたくさん書いてあるスレッド
https://github.com/heartcombo/devise/issues/4486

投稿2020/02/12 10:26

編集2020/02/12 12:22

no1knows

総合スコア3365

T.Adams

2020/02/12 12:02

大変丁寧にありがとうございます。 application.html.erbのヘッダーの中身を置き換えましたが、結果は変わりませんでした。githubを参考にもう少し進めてみます。ありがとうございました。

T.Adams

2020/02/12 12:06

no1knows様、大変丁寧にそして迅速に対応して頂き、本当に感謝しております。上記に記載のgithubで"jorgearimitsu"様がおっしゃっている、button_to helperを使用したところ、問題を解決することができました！！！！ありがとうございます。

no1knows

2020/02/12 12:09 編集

お力になれずすいません＞＜おぉ、それは良かったです！

no1knows

2020/02/12 12:11

<%= button_to 'Exit', destroy_user_session_path, method: :delete %> ですかね？ link_toはだめでbutton_toはOKなのも気になりますが、解決してよかったです！

T.Adams

2020/02/12 13:19

<%= button_to 'Exit', destroy_user_session_path, method: :delete %>です。 →link_toはだめでbutton_toはOKなのも気になりますがそうですよねえ。まあこの質問に関しては一旦これで終わりにします。もし解決策が見つかった場合はまた記載します。

no1knows

2020/02/12 13:21

上に追記をかきましたのでご確認ください！

行動規範の内容に同意します