Chatbot UI legacyの問題

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/0b4e3401-e789-6ca8-ca21-33a31ae509b1.png)

作成日： 2024年5月2日(水)
更新日：2025年3月9日(日) o1/o3 serise対応版のご紹介追加

## １．はじめに

　Chatbot UIはVersion 2.0.0がリリースされていますが、本番稼働させるには少しリスクが高いため、安定板を使用してRAG(Retrieval-Augmented Generation)を用いて知識データベースの内容をベクトル検索して、LLM(Learge Language Model)に回答をさせようと考えました。

　その際、Chatbot UIはlegacy版のできるだけ新しいものを使おうと思い、Mckay Wrigley氏によって作成されたChatbot UIの[legacy](https://github.com/mckaywrigley/chatbot-ui/tree/legacy)ブランチ(2023/04/05 1:09:19最終コミット)を用いてローカル環境でChatbot UI legacyを起動させてみたのですが、「モデルの取得中にエラーが発生しました。」というエラーとなり動作しませんでした。

　この記事ではChatbot UI 2023年04月20日版にできるだけ近いバージョンを構築して、回答が途切れる問題の対策、gpt-35-turbo-16kモデルの対応までをまとめます。

  Chatbot UI legacy braunch

https://github.com/mckaywrigley/chatbot-ui/tree/legacy

この記事は作成から日数が経過しておりますが、2025年3月9日(土)に@kekekekentaさんがChatbot UI legacyをo1/o3 seriseに対応させた記事「[Chatbot UI (legacy) を o3-mini や GPT-4.5 Preview に対応してみた（APIバージョン2025-02-01-preview）](https://qiita.com/kekekekenta/items/3376700e497dd47ba811)」を作成されていますので、最新版をご希望の型はそちらを参照ください。
丁度、会社で、「[Azure OpenAI の推論モデル](https://learn.microsoft.com/ja-jp/azure/ai-services/openai/how-to/reasoning?tabs=python-secure)」の記事でChatbot UIの利用をあきらめようとしていたところでしたので、貢献に感謝いたします。

https://qiita.com/kekekekenta/items/3376700e497dd47ba811


```
**モデルの取得中にエラーが発生しました。**
OpenAIのAPIキーがサイドバーの左下に設定されていることを確認してください。
このステップを完了した場合、OpenAIに問題が発生している可能性があります。
```

![model-peek-error.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/6c385678-5572-3023-c347-56119ad071f9.png)

```
Q:\OneDrive\Git\chatbot-ui>npm run dev

> ai-chatbot-starter@0.1.0 dev
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Loaded env from Q:\OneDrive\Git\chatbot-ui\.env.local
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme
event - compiled client and server successfully in 2.8s (233 modules)
wait  - compiling...
event - compiled successfully in 329 ms (194 modules)
wait  - compiling / (client and server)...
event - compiled client and server successfully in 6.5s (5469 modules)
wait  - compiling /api/models (client and server)...
event - compiled successfully in 200 ms (43 modules)
wait  - compiling...
event - compiled successfully in 0 ms (43 modules)
wait  - compiling...
event - compiled successfully in 0 ms (43 modules)
**OpenAI API returned an error 404: {"error":{"code":"404","message": "Resource not found"}}
[Error: OpenAI API returned an error]**
OpenAI API returned an error 404: {"error":{"code":"404","message": "Resource not found"}}
[Error: OpenAI API returned an error]
```
*コンソールメッセージ*

## ２．情報収集

「モデルの取得中にエラーが発生しました。」というエラーは2023年5月15日にAzure OpenAIのAPI仕様が変わったときにも発生したエラーで[KentatoAOKI](https://github.com/KentaroAOKI/chatbot-ui/commits?author=KentaroAOKI)氏により[Pull Requests #936](https://github.com/mckaywrigley/chatbot-ui/pull/936)でCloseされていますが、マージはされていません。

実際にlegacyブランチのpages/api/models.tsとutils/server/index.tsを見てみるとAzureの新API仕様に対応されているようには見えません。

## ３．動作しない原因

　Mckay Wrigley氏によって作成されたChatbot UIのlegacyブランチは2023/04/05 1:09:19のコミットをベースに作成されており、Azureで動作させるのに欠かせない[#936](https://github.com/mckaywrigley/chatbot-ui/pull/936)の対応が含まれていないことが分かりました。
![legacy-log-messages.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/4d687801-2bdf-6d10-c02b-5769cfc1efbd.png)

Discussionsの「[Chatbot-UI legacy #1496](https://github.com/mckaywrigley/chatbot-ui/discussions/1496)」で2023年4月4日以降、2023年4月20日の「[add Finnnish translations #618](https://github.com/mckaywrigley/chatbot-ui/pull/618)」までのコミットがlegacyに含まれていないため、Mckay Wrigley氏にコミットをお願いしている投稿がありましたが、Mckay Wrigley氏はこれに反応していませせん。

やむを得ず、2023年4月20日のコミットをベースに差分を吸収しようと思いましたが、mainブランチは2024年1月9日に一掃されており2023年4月4日～2023年4月20日のコミットを見つけられませんでした。

2023年4月20日の最後のコミットはAzureの新APIに対応できていなかったり、応答が1000トークンで中断される不具合がありましたが、比較的安定板だったので、ととも残念です。

![Truthful-log-messages.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/418ad8d5-b8d2-c963-c527-ce1299510021.png)

## ４．forkからfork

　幸いにも[Pull Request #936](https://github.com/mckaywrigley/chatbot-ui/pull/936)でAzureの新API対策を行ったKentaroAOKI氏がPull Requestのためにforkを作成していますので、今回はこのforkをベースにLLMの修正と応答が1000トークンで切れる問題の差分吸収をしていきます。

| No | 区分 | リポジトリ | ブランチ | 備考 |
| --- | --- | --- | --- | --- |
| 1 | fork元 | https://github.com/KentaroAOKI/chatbot-ui/ | feature-supports-azure-openai-api-2023-05-15-or-later | 23/5/15のAzureでのAPI仕様変更に対応 |
| 2 | fork先 | https://github.com/potofo/chatbot-ui/ | feature-supports-azure-openai-api-2023-05-15-or-later |  |

※リポジトリをforkしていますのでブランチの記載はメモ程度の意味です。

https://github.com/KentaroAOKI/chatbot-ui/には以下のOpenAI API仕様変更に対策が含まれています。

　pages/api/models.ts
　![diff-models.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/3d97cc61-e07e-0d6f-274d-b5dcc62cdb61.png)

　utils/server/index.ts
　![diff-index.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/52946c3c-dd60-c954-887c-361ad2c2c774.png)

https://github.com/KentaroAOKI/chatbot-ui

## ５．安定板ブランチの作成

　forkしたリポジトリとブランチから作業用のブランチを作成します。

 | No | 区分 | リポジトリ | ブランチ | 備考 |
| --- | --- | --- | --- | --- |
| 1 | ブランチ元 | https://github.com/potofo/chatbot-ui/ | feature-supports-azure-openai-api-2023-05-15-or-later |  |
| 2 | ブランチ先 | https://github.com/potofo/chatbot-ui/ | fixed |  |

## ６．取り込む対策

| No | 区分 | 題名 | 内容 | 備考 |
| --- | --- | --- | --- | --- |
| 1 | Issues | https://github.com/mckaywrigley/chatbot-ui/issues/316 | chatbot UIからの応答が無条件に1,000トークン付近で切れてしまう問題の対策です。  utils/server/index.tsのmax_tokensをUIで変更できないか(デフォルトで1,000に固定されているため、LLMからの応答が1,000トークン毎に切れてしまう。）「続けてください」と入力することで回避は可能だがかなり面倒 | 2024年1月10日にVer2.0.0にマージされているようです。 |
| 2 | Azure OpenAI gpt-35-turbo-16k | Azure OpenAIのgpt-35-turbo-16kモデルの追加 | types/openai.tsにAzure OpenAIのgpt-35-turbo-16k、gpt-4、gpt-4-32kを追加しています。これによりモデルの切り替えも可能です。 |  |
| 3 | SyntaxError: Unexpected token 'D', "[DONE]" is not valid JSON |https://github.com/mckaywrigley/chatbot-ui/issues/580 | LLMからの非同期応答時に最後にJSONの代わりに文字列の”[DONE]”が応答される仕様ですが、utils/server/index.tsの93行目付近のtryが文字列の”[DONE]”に対応できずにSentax Errorで実行時エラーとなってしますため、dataが”[DONE]”以外の場合だけ処理するようにする |  |

## ７．動作確認

##　７．動作確認
gpt-35-turbo-16kで「生成AIについて10,000文字以上でブログ記事を書いてください。」というプロンプトでで2018文字の応答を途切れず生成

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/5745bd86-c333-ef16-9880-f82bfc8ecee0.png)

max_tokens: 1000をコメントアウトしないと989文字で応答が途切れてしまいました。
途切れた場合でも「続けてください」と入力すると続きは出力してくれますが、これは面倒です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3764962/fb051e8c-6744-01e3-5623-142c69161713.png)

## ８．参考URL

今回の記事の執筆に関して関連する記事、GitHUBリポジトリを以下にまとめます。

- **[Chatbot UI (legacy) を o3-mini や GPT-4.5 Preview に対応してみた（APIバージョン2025-02-01-preview）](https://qiita.com/kekekekenta/items/3376700e497dd47ba811)**
  @kekekekentaさんのChatbot UI o1/o3 seriaseサポート記事
- **[KentaroAOKI/chatbot-ui/feature-supports-azure-openai-api-2025-02-01-preview](https://github.com/KentaroAOKI/chatbot-ui/tree/feature-supports-azure-openai-api-2025-02-01-preview)**
  @kekekekentaさんのo1/o3 serise対応ブランチ
- **[mckaywrigley/chatbot-ui/legacy](https://github.com/mckaywrigley/chatbot-ui/tree/legacy)**
Chatbot UI legacyオリジナルのブランチ（2023年4月6日～4月20日の対策がされていないため、「モデル取得中にエラーが発生しました」エラーとなります。
- **[Chatbot UI legacyの問題 (Qiita:2024年5月2日記事)**
mckaywrigley/chatbot-ui/legacyの問題に対する対策を解説しています。
- **[potofo/chatbot-ui/fixed](https://github.com/potofo/chatbot-ui/tree/fixed)**
mckaywrigley/chatbot-ui/legacyの問題の対策を取り込んだFork