link_toでメソッドをdeleteに指定しているのに、getリクエストが送信される

Question

前提・実現したいこと

Railsでwebアプリを作っています。
ログアウト機能において、headerのボタンを押すとログアウトする仕組みを実現したいです。

headerのlink_toでmethod: :deleteと明示しているのですが、ログアウトボタンを押すと

No route matches [GET] "/logout"

のrouting errorが出てしまいます。

このエラーの解決方法を教えていただきたいです。

ソースコードは下述いたします。

程度の低い質問でしたら申し訳ございません。
また、質問に必要な情報等に不足があれば、お手数ですがご指摘いただければ、追記いたします。

よろしくお願いいたします。

該当のソースコード

[_header.html.erb]
<header>
  <%= image_tag "logos/logo_transparent.png", class: "main-logo" %>
  <% if logged_in? %>
    <li class="dropdown" >
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">
        <i class="fas fa-bars bars"></i>
      </a>
      <ul class="dropdown-menu dropdown-menu-right">
        <li><i class="fas fa-home color"></i><%= link_to "Home", "#" %></li>
        <li><i class="far fa-envelope color"></i><%= link_to "DM", "#" %></li>
        <li><i class="fas fa-search color"></i><%= link_to "Search", "#" %></li>
        <%= link_to "Log out", "/logout", method: :delete, class: "logout btn btn-primary"  %> //該当箇所ここです
      </ul>
    </li>
    <!--ここにuserimage追加したい-->
    
    <div class="menu-pc">
      <%= link_to "Log out", logout_path, method: :delete, class: "logout-pc d-none d-lg-inline btn btn-primary"  %>
    </div>
  <% else %>
    <%= link_to "Log in", login_path, class: "btn btn-primary login" %>
  <% end %>
</header>

[routes.rb](ゴチャゴチャしていてすみません。コメントアウト部は無視してください。)
Rails.application.routes.draw do
  
  get 'sessions/new'
  root 'static_pages#language'
  get '/home_jp', to:'static_pages#home_jp'
  get '/home_en', to:'static_pages#home_en'
  get '/signup', to:'users#new'
  get '/after_signup', to: 'users#after_signup'
  get '/signup_jp', to:'users#signup_jp'
  post '/signup_jp', to:'users#create'
  # get '/details', to:'users#details'
  # post '/details', to:'users#details_create'
  patch 'users/:id/edit', to:'users#update'
  get '/login', to:'sessions#new'
  post '/login', to:'sessions#create'
  delete '/logout', to:'sessions#destroy' #!!!該当部ここです!!!
  # patch '/users/:id/edit_email', to:'users#update'
  # get '/users/:id/edit_password', to:'users#edit_password'
  # patch '/users/:id/edit_password', to:'users#update'
  # get '/users/:id/delete', to:'users#delete', as: 'delete'
  # delete '/users/:id/delete', to:'users#destroy' #これはresouces :usersに含まれている
  
  # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
  # resources :sessions

  resources :users do
    member do
      # get :edit_email 
      # patch :edit_email #updateアクションに繋げたい
      # get :edit_password
      # patch :edit_password #updateアクションに繋げたい
      # get :delete #deleteアクションに繋げたい
      # get :details
      # post :details #details_createアクションに繋げたい
    end
  end

  resources :details ,only: [:new, :create]
  resources :account_activations, only: [:edit]

  resources :edit_email, only: [:edit, :update]

  resources :edit_password, only: [:edit, :update]

  resources :delete_user, only: [:edit, :destroy]

end

[sessions_controller.rb]
class SessionsController < ApplicationController
  def new
  end
  
  def create
    user = User.find_by(email: params[:session][:email].downcase )
    if user && user.authenticate(params[:session][:password])
      if user.activated?
        log_in user
        params[:session][:remember_me] == '1' ? remember(user) : forget(user)
        redirect_to user
      else
        message = "Account not activated. "
        message += "Check your email for the activation link."
        flash[:warning] = message
        redirect_to root_url
      end
    else
      flash.now[:danger] = 'invalid email/password combination'
      render 'new'
    end
  end
  
  def destroy
    log_out if logged_in?
    redirect_to root_path
  end
  
  def log_in(user)
    session[:user_id] = user.id
  end
end

[application.js]
// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("@fortawesome/fontawesome-free/js/all")
require("jquery")
import "bootstrap"


// Uncomment to copy all static images under ../images to the output folder and reference
// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
// or the `imagePath` JavaScript helper below.
//
// const images = require.context('../images', true)
// const imagePath = (name) => images(name, true)

補足情報（FW/ツールのバージョンなど）

Rails 6.0.3
Ruby 2.6.3

Answer 1

rails-ujsは入れていますでしょうか。

リンクからGET以外のリクエストを使うには、JavaScriptを活用する必要があります。

Comments

[takuma1229]

回答ありがとうございます。
application.jsのソースコードを追記しました。
これはrails-ujsを導入できている状態と考えてよいでしょうか？

[maisumakun]

application.jsはビューから呼び出していますか？

[takuma1229]

`<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>`
application.html.erb内でこの記述をしているので、呼び出していると思います。

[maisumakun]

うーん、これが原因ではないのかもしれませんね…

[takuma1229]

なるほど。。。ありがとうございます。
他に可能性のある原因等あれば教えていただけるととてもありがたいです！

[maisumakun]

ブラウザコンソールにエラーが出ていたりはしませんか？

[takuma1229]

デベロッパーツールでコンソールを見たら以下が出ていました。

Unchecked runtime.lastError: The message port closed before a response was received.
logout:1 Failed to load resource: the server responded with a status of 404 (Not Found)

[maisumakun]

よくわからないですね…

[takuma1229]

承知しました。もう少し自分で対処してみます。ありがとうございました！