学習コンテンツの検索にNgramを使用して、全文検索を実装した話。

1. Ngramで全文検索を
実装した話
株式会社Infratop テクノロジースタジオ 渡邉 里菜
2019/3/22

2. 自己紹介
株式会社インフラトップ
テクノロジースタジオ
渡邉 里菜
@nabeerina
餃子部 部長

3. CONTENTS
01 背景 なぜ検索機能を実装したの？
02 開発
03 課題・反省
04 まとめ
どうやって開発したの？そもそもNGRAMとは？
リリース後の課題・取り組み
まとめ

4. 01 背景
なぜ検索機能を
実装したの？

5. WEB CAMP ONLINE(コンテンツ)を
覚えていますか？

7. 学習中にキーワードを調べたい時な
かなか調べられない・・・

8. 全章まとめて検索をかけられ
ると困ったときに調べやすい
勉強したワードを復習したい
なという時に、どこの章だか
探すのが大変だったので、
検索ワードですぐ学習した章
に飛べるとより良いと思いま
した。
受講生アンケートより
課題

9. コンテンツ内を
検索できればいいに...

10. 現状(2018/12リリース)

14. 02 開発
全文検索とは...?
Ngramとは...?
実際の開発内容に関して

15. 文書の検索方法のひとつ。複数の文書の中から、指
定した文字列を含む文書を検索する。ひとつずつファ
イルを開いて検索する方法に比べて手間はかからな
いが、検索に時間がかかる。代表的なのがWWWの
検索サービスで、インターネット上のWebページから
キーワードを含むページを検索できる。《full-text
search》データベースやウェブページから、ある文字列
を検索する際、全文書を対象に目的の文字列を検索
すること。(コトバンクより)
閲覧権限のある
文書を対象に検索し、
適切な関連度・重要度で
表示すること。
全文検索とは...?

16. 文書の検索方法のひとつ。複数の文書の中から、指
定した文字列を含む文書を検索する。ひとつずつファ
イルを開いて検索する方法に比べて手間はかからな
いが、検索に時間がかかる。代表的なのがWWWの
検索サービスで、インターネット上のWebページから
キーワードを含むページを検索できる。《full-text
search》データベースやウェブページから、ある文字列
を検索する際、全文書を対象に目的の文字列を検索
すること。(コトバンクより)
閲覧権限のある
文書を対象に検索し、
適切な関連度・重要度で
表示すること。
全文検索とは...?
NOT LIKE 検索(部分一致)

17. 全文検索とは...?
焼き餃子 水餃子 宇都宮餃子
渋谷餃子に
ついて

18. 全文検索とは...?
焼き餃子 水餃子 宇都宮餃子
渋谷餃子に
ついて
餃子

19. 全文検索とは...?
焼き餃子 水餃子 宇都宮餃子
渋谷餃子に
ついて
餃子
LIKE検索は検索ワード
「餃子」が含まれる
ドキュメントを全て表示

20. 文書の検索方法のひとつ。複数の文書の中から、指
定した文字列を含む文書を検索する。ひとつずつファ
イルを開いて検索する方法に比べて手間はかからな
いが、検索に時間がかかる。代表的なのがWWWの
検索サービスで、インターネット上のWebページから
キーワードを含むページを検索できる。《full-text
search》データベースやウェブページから、ある文字列
を検索する際、全文書を対象に目的の文字列を検索
すること。(コトバンクより)
閲覧権限のある
文書を対象に検索し、
適切な関連度・重要度で
表示すること。
全文検索とは...?

21. 全文検索とは...?
焼き餃子 水餃子 宇都宮餃子
渋谷餃子に
ついて
餃子

22. 全文検索とは...?
水餃子 宇都宮餃子
渋谷餃子に
ついて
餃子

23. 全文検索とは...?
水餃子 宇都宮餃子
渋谷餃子に
ついて
餃子
閲覧権限のあるファイルの
み検索結果に表示される。
中身の関連度が高い順に
表示することも可能。

24. ● Elastic Search
● Solr
● Groonga
検索エンジン一例

25. 検索エンジンは導入コストがかかる...
MySQLのバージョンが5.5だった
MySQL 5.5
WEB CAMP ONLINEにアクセス
2018/秋頃 環境
サーバ

26. WEB CAMP ONLINEにアクセス
AWS移行に伴い、MySQLのバージョンを5.7に！
RDSは全文検索の手段としてNgramのみ可能！！
2018/冬頃 環境

27. 任意の文字列や文書を連続したn個の文字で分割す
るテキスト分割方法． 特に，nが1の場合をユニグラム
（uni-gram），2の場合をバイグラム（bi-gram），3の場
合をトライグラム（tri-gram）と呼ぶ． 最初の分割後は
1文字ずつ移動して順次分割を行う．(コトバンクより)
文をN文字に
分解する
(例)
2gramの場合
私は餃子が好きです
私は/は餃/餃子/子が/が好/好き/きで/です
3gramの場合
私は餃子が好きです
私は餃/は餃子/餃子が/子が好/が好き/
好きで/きです
Ngramとは...?

28. 03.
検索結果を表示
02.
検索キーワードを
SQLクエリで関連度をス
コアリングしながら抽出
開発
01.
Ngramを使 用して検
索対象の
インデックス作成

29. 01.
Ngramを使 用して検
索対象の
インデックス作成
開発
ALTER TABLE テーブル名
ADD FULLTEXT カラム名
WITH PARSER ngram;
これだけでDBに
辞書テーブルが作成される

30. 01.
Ngramを使 用して検
索対象の
インデックス作成
開発
(例)餃子が食べたい
mysql> SELECT * FROM INFORMATION_SCHEMA.INNODB_FT_INDEX_CACHE;
+--------+--------------+-------------+-----------+--------+----------+
| WORD | FIRST_DOC_ID | LAST_DOC_ID | DOC_COUNT | DOC_ID | POSITION |
+--------+--------------+-------------+-----------+--------+----------+
| たい | 2 | 3 | 2 | 2 | 15 |
| べた | 2 | 3 | 2 | 2 | 12 |
| 食べ | 2 | 3 | 2 | 2 | 9 |
| が食 | 2 | 2 | 1 | 2 | 6 |
| 子が | 2 | 2 | 1 | 2 | 3 |
| 餃子 | 2 | 2 | 1 | 2 | 0 |
+--------+--------------+-------------+-----------+--------+----------+

31. 開発
MATCH (カラム名)
AGAINST (検索ワード IN BOOLEAN MODE)
SELECT カラム名
MATCH(title, strip_body) AGAINST ('+パラメータ1' IN
BOOLEAN MODE) AS score
FROM テーブル名
WHERE
MATCH(title, strip_body) AGAINST ('+パラメータ1' IN
BOOLEAN MODE)
ORDER BY score DESC
02.
検索キーワードを
SQLクエリで関連度をスコア
リングしながら抽出

32. 開発
カレーの本が
欲しい
カレーに関係する本を
選んだよ(ドヤ)
カレーに関係する本
を選ぶ

33. 開発
検索キーワード 検索キーワードに
に関係する
コンテンツを返す
検索キーワードを
受け取り、関連するコンテ
ンツを探す

34. 開発
03.
検索結果を表示

35. 文書の検索方法のひとつ。複数の文書の中から、指
定した文字列を含む文書を検索する。ひとつずつファ
イルを開いて検索する方法に比べて手間はかからな
いが、検索に時間がかかる。代表的なのがWWWの
検索サービスで、インターネット上のWebページから
キーワードを含むページを検索できる。《full-text
search》データベースやウェブページから、ある文字列
を検索する際、全文書を対象に目的の文字列を検索
すること。(コトバンクより)
閲覧権限のある
文書を対象に検索し、
適切な関連度・重要度で
表示すること。
全文検索とは...?

36. 現状(2018/12リリース)

37. 03 課題・反省
開発当時の課題
開発後の取り組み

38. ● コンテンツ内のhtmlタグのおかげで、ユーザーの求める検
索結果ではなかった(検索ノイズが多かった)
● ストップワード(検索対象外のワード)による挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い(1回の検索に5秒くらいかかった)
開発当時の課題

39. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
検索対象のカラム
------------------------------
<h2>画像投稿ができるようにしよう！ </h2>
<p>現在はテキストのみ投稿可能な状態ですが、ここに画像が投稿で
きる機能を追加します。 </p>
<p>画像投稿機能を実装するため、「 gem（ジェム）」というツールを使っ
て機能を追加していきます。 </p>
<h3>ここで行う作業</h3>
<ul>
<li>gemについて</li>
<li>gem ‘refile’ の追加</li>
<li>image_idカラムの追加</li>
<li>refile用にコードを書き足す </li>
<li>フォームに画像投稿用の項目を追加 </li>
------------------------------
HTMLタグが含まれていた...

40. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
検索対象のカラム
------------------------------
画像投稿ができるようにしよう！
現在はテキストのみ投稿可能な状態ですが、ここに画像が投稿できる
機能を追加します。
画像投稿機能を実装するため、「 gem（ジェム）」というツールを使って
機能を追加していきます。
ここで行う作業
gemについて
gem ‘refile’ の追加
image_idカラムの追加
refile用にコードを書き足す
フォームに画像投稿用の項目を追加
------------------------------
HTMLタグを取り除くことで
検索ノイズを解消！！

41. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
Ngramには辞書に登録されない
ストップワードが存在する。
(一覧)
a, about, an, are, as, at, be, by, com, de, en, for,
from, how, i, in, is, it, la, of, on, or, that, the, this,
to, was, what, when, where, who, will, with, und
the, www
deviseなどが検索できない...

42. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
今回は、
ストップワードを使用しない
ことで検索ノイズを解消！

43. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
東京都問題
2gramの場合
東京/京都
3gramの場合
東京都
つまり、3gramの方が検索ノイズが少ない◎
しかし、3gramで検索できないワードがあった...

44. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
今回は、
2gramにすることで
検索ノイズを解消！

45. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題

46. 【バックエンド】
● コンテンツ内のhtmlタグのおかげで
ユーザーの求める検索結果ではなかった
(検索ノイズが多かった)
● ストップワード(検索対象外のワード)に
よる挙動のノイズ
● 2gramにするか3gramにするかで悩む
● 検索結果の表示が遅い
(1回の検索に5秒くらいかかった)
開発当時の課題
検索データを抽出する
部分が遅い
↓
SQLのスロークエリになって
いる部分をEXPLAINでデバッグ
↓
SQLを変更したことで
表示速度アップ

47. 検索データの可視化
開発後の取り組み

48. 開発後の取り組み
成果はすぐにDOYAしよう！

49. 04 まとめ

50. まとめ
● リリース後のシステム運用まで想定した設計・開発をし
よう！
● ユーザーに使ってもらえるものを開発するのは、めちゃ
くちゃ面白い！

51. THANK YOU
ご静聴ありがとうございました。