Watson Discovery への接続を自由にカスタマイズする Part 2

<img src="https://i.ibb.co/Gt6syLF/2022-12-25-10-12-46.png" alt="2022-12-25-10-12-46" border="0">

今回は、[前回](https://qiita.com/yanagih/items/4624be7ebaeff0bd12bd)の続きの記事です。
前回の記事で、画面上に **Answer Finding** の結果とその**確信度**を表示してみました。
今回は、**パッセージの表示**を追加してみます。さらに、**カスタム・レスポンス**を使って**見栄えの調整**も行います。

# カスタマイズ手順

2 つのステップで実施します。

* カスタム拡張機能の呼び出し定義にパッセージ関連を追加
* カスタム・レスポンスを定義した index.html を作成

それでは順番に見ていきます。

### カスタム拡張機能の呼び出し定義にパッセージ関連を追加

検索結果を保存するセッション変数と Watson Discovery を呼び出すアクションを作成します。

#### セッション変数の追加

パッセージ関連のセッション変数を追加します。

:::note info
セッション変数の作成方法は、[注文のキャンセル処理を追加する 〜セッション変数の使い方〜](https://qiita.com/yanagih/items/ea38bc109527a5127dc0#%E3%82%BB%E3%83%83%E3%82%B7%E3%83%A7%E3%83%B3%E5%A4%89%E6%95%B0%E3%82%92%E5%AE%9A%E7%BE%A9%E3%81%99%E3%82%8B) をご参照ください。
:::

今回追加するセッション変数は <font color="red">赤字</font> です。
| Name | Type | Description |
|:----------|:-----------|:------------|
| query_text | Any| 検索文字列 |
| search_result | Any| 検索結果の保存 |
| title | Any| wikipediaのタイトル |
| answer | Any| Answer Findingで見つかった回答 |
| answer_confidence | Number| 回答の確信度 |
| link | Any| wikipediaのリンク |
| <font color="red">snippet</font> | Any| パッセージ本体 |
| <font color="red">passage_start_offset</font> | Any | パッセージの開始位置 |
| <font color="red">answer_start_offset</font> | Number | 回答の開始位置 |
| <font color="red">answer_end_offset</font> | Number | 回答の終了位置 |


#### ステップの修正

**Discoveryにつないで**アクションの**ステップ** を修正します。

##### ステップ 2 の**And then** パート
<img src="https://i.ibb.co/yVTSrZj/2022-12-25-9-48-50.png" alt="2022-12-25-9-48-50" border="0">

(passage.characters の値)
<img src="https://i.ibb.co/yy9NzW5/2022-12-25-9-56-20.png" alt="2022-12-25-9-56-20" border="0">

##### ステップ 3 の**Variable values** パート
<img src="https://i.ibb.co/0qNRnYX/2022-12-25-10-02-15.png" alt="2022-12-25-10-02-15" border="0">

今回追加する変数は <font color="red">赤字</font> です。
| セット先変数 | 値 |
|:----------|:-----------|
| search_result | ${search_result}.get(0)| 
| answer | ${search_result}.document_passages.get(0).answers.get(0).answer_text| 
| link | ${search_result}.url| 
| title | ${search_result}.title| 
| answer_confidence | ${search_result}.document_passages.get(0).answers.get(0).confidence| 
| <font color="red">snippet</font> | ${search_result}.document_passages.get(0).passage_text| 
| <font color="red">answer_start_offset</font> | ${search_result}.document_passages.get(0).answers.get(0).start_offset| 
| <font color="red">answer_end_offset</font> | ${search_result}.document_passages.get(0).answers.get(0).end_offset| 
| <font color="red">passage_start_offset</font> | ${search_result}.document_passages.get(0).start_offset| 

##### ステップ 3 の**Assistant says** パート

JSON view を使用して編集します。

<img src="https://i.ibb.co/y8T1mv6/2022-12-25-10-09-43.png" alt="2022-12-25-10-09-43" border="0">

```JSON: Assistant says
{
  "generic": [
    {
      "user_defined": {
        "link": "${link}",
        "title": "${title}",
        "answer": "${answer}",
        "snippet": "${snippet}",
        "answer_confidence": "${answer_confidence}",
        "answer_end_offset": "${answer_end_offset}",
        "user_defined_type": "search_card",
        "answer_start_offset": "${answer_start_offset}",
        "passage_start_offset": "${passage_start_offset}"
      },
      "response_type": "user_defined"
    }
  ]
}
```

### カスタム・レスポンスを定義した index.html を作成

ポイントだけ、ご説明します。
全てのコードは、Github [wd_extensions](https://github.com/Watson-bx-04/wd_extensions/) にて公開しております。

カスタム・レスポンス・カード **WACTextholderTile** の定義を**スタイル・セクション**に記述しています。
<img src="https://i.ibb.co/B3LbsZD/2022-12-25-10-28-29.png" alt="2022-12-25-10-28-29" border="0">

**searchCardHandler 関数**にて、表示項目を定義しています。
<img src="https://i.ibb.co/0nC9yhs/2022-12-25-10-33-42.png" alt="2022-12-25-10-33-42" border="0">

回答の確信度が **0.4** 以上に絞り込む処理とパッセージ内での**回答の強調表示**を行う関数を定義しています。
<img src="https://i.ibb.co/QPcMgPD/2022-12-25-10-36-51.png" alt="2022-12-25-10-36-51" border="0">

:::note info
標準機能のサーチでは、確信度が低い回答も表示されていましたが、**reformat() 関数**を修正することで調整できますね。
:::

# 試してみる

前回もやった同じ質問をしてみます。

質問 『ピザの日はいつ』
質問 『宅配ピザを始めたお店は』
質問 『ピザの誕生秘話』

**Anser Finding の結果**、**Answer Finding の確信度**、**パッセージ**をカスタム・レスポンスで作成したカード内に表示できるようになりました。
<img src="https://i.ibb.co/wrJjJw5/2022-12-25-10-21-15.png" alt="2022-12-25-10-21-15" border="0">

# いかがでしたでしょうか

Watson Discovery への接続パラメータの変更や検索結果を自由にレイアウトできるようになりました。
標準機能のサーチだけで機能が不足する場合は、今回の記事を参考に、色々とカスタマイズしてみてください。

本日が、Qitta Advent Calendar 2022 最終日です。<font color="DeepSkyblue">無事終える</font>ことができました。
また、私の記事を参照してくれた皆さん、本当にありがとうございます。

# 参考情報

### Qiita Advent Calendar 2022
https://qiita.com/advent-calendar/2022/wanclcfc_enjoy

### 公式サイト: Watson Discovery API - Query パラメータ
https://cloud.ibm.com/apidocs/discovery-data#query

### Github: Watson Discovery Extension OpenAPI 文書
https://github.com/watson-developer-cloud/assistant-toolkit/tree/master/integrations/extensions/starter-kits/watson-discovery

### 関連記事
https://qiita.com/yanagih/items/4624be7ebaeff0bd12bd

https://qiita.com/yanagih/items/64e517f1fd7cce059b3c

https://qiita.com/yanagih/items/a55d48892572e2df3383

https://qiita.com/yanagih/items/ae4fdf5a72bf665ce142

https://qiita.com/yanagih/items/6313af815e6c5180d950

### 扱いたかった記事

https://web.dev/text-fragments/