【Rails】あいまい検索機能実装の流れを詳しく解説

本記事では、LIKE句を利用した「あいまい検索機能」の実装手順を、アプリ制作を通して詳しく解説します。

完成画面

あいまい検索機能実装の流れ

LIKE句を利用した「あいまい検索機能」は、大まかに以下流れで実装していきます。

実装手順

⓪はじめに

コーディングはhaml/Scssを利用しています。

商品情報一覧が格納されている「itemsテーブル」から、あいまい検索を通して任意の商品情報を検索、表示させる実装を行なっています。

また本記事で紹介する検索機能について、MVCの概念図に照らし合わすと、大まかには以下の流れになります。

※MVC概念図の番号と、本記事の実装手順の番号は関係ありません

それではこの構造を頭に入れた上で、実装していきます。

①検索フォーム作成

はじめに、検索フォームを作成します。

検索フォームに入力された文字列を、
name: “keyword”として、items/searches#index に送信しています。

※「items/_searchbar.html.haml」は、「items/index.html.haml 」から呼び出している、フォーム専用の部分テンプレートです。

= form_with(url: items_searches_path, local: true, method: :get) do |f|
  %input.search__input{name: "keyword", placeholder: 'キーワードから探す'}
  %button{type: 'submit'}
    .icon
      = image_tag 'icon/icon-search 1.png', class: 'icon-image'

②コントローラ作成

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

rails g controller items::searches

次に、コントローラに以下を記述します。

①の検索フォームに入力された文字列を params[:keyword] で受け取り、その文字列をitemsテーブルで検索をする、という処理を @items に格納します。

※searchは自作メソッドのため、処理を定義する必要があります。これは④で行いますので、一旦次へ進みます。

class Items::SearchesController < ApplicationController
  def index
      @items = Item.search(params[:keyword])
      @search_word = params[:keyword]
  end    
end

③ルーティング設定

②のsearchesコントローラのindexアクションで検索した値を表示します。

namespace :items do
  resources :searches, only: :index
end

④メソッド作成

if文で条件分岐処理をします。

まず検索フォームから値を受け取った場合、Itemテーブルのnameカラムにおいて、あいまい検索を行なっています。

そして値が存在しない場合は、すべての商品情報を返す処理を行なっています。

class Item < ApplicationRecord
  def self.search(keyword)
    if search
      Item.where(['name LIKE ?', "%#{keyword}%"])
    else
      Item.all
    end
  end
end

⑤検索結果画面の作成

検索結果画面です。

ヘッダー、サイドメニュー、商品一覧は部分テンプレートを使用しています。ちなみにここで呼び出しているファイル群は、以下の階層構造となっています。

※このhtmlは一例ですので、適宜調整ください。

= render 'items/header'
.search
  .search-contents
    = render 'sideMenu'
    .search-main
      %h2.search-main__title
        -if @search_word.present?
          = @search_word
          %span の検索結果
        -else
          = "検索結果"
      .search-main__itemsCnt
        = "1-#{@items.count}件表示"
      = render 'searchedItems'

おわりに

LIKE句を利用した「あいまい検索機能」の実装手順は以上になります。

中でもコントローラとモデルを分類する点は、少々分かりづらいですが、大切な点の1つかと思います。

今回のように、if文による条件分岐や、何か計算が必要な際は、出来るだけモデルに記述しましょう。

実装完了後は、単体テストの実施もおすすめします。

【Rails】検索機能のモデル単体テストの手順を詳しく解説本記事では、検索機能のモデル単体テストの実施手順を、詳しく解説します。LIKE句を利用した「あいまい検索」の実装方法はこちらをご覧ください。成功画面まず、以下が本テスト成功の結果コードです。テストは様…

また検索機能の実装は、高度な検索機能を実装をできる「ransack」というgemを使用した方法もあります。実装手順は以下にまとめていますので、よろしければご参照ください。

【Rails】ransackを用いて検索機能を実装する方法本記事では、シンプルなコードで様々な検索フォームを実装できるgem「ransack」を用いた検索機能の実装手順を詳しく解説します。gemを使用しない、LIKE句を利用したあいまい検索機能の実装方法は、こちらをご覧く…