Agent Canvas 1.18.0でOpenRouterのモデル候補を増やす
100%チャッピーまかせの記事です。
掲題の通りOpenRouterの特定のモデルが使えなかったので修正。
でも非公式なやり方です。
OpenHandsのライセンスと公式リポジトリは
https://github.com/OpenHands/OpenHands を参照してください。
掲題の通りOpenRouterの特定のモデルが使えなかったので修正。
でも非公式なやり方です。
OpenHandsのライセンスと公式リポジトリは
https://github.com/OpenHands/OpenHands を参照してください。
---
Agent Canvas 1.18.0のモデル選択画面で、OpenRouterの候補を増やすためにフロントエンドのJavaScriptを2か所変更した記録です。
Dockerコンテナ名はopenhands、配置先は/opt/agent-canvas/frontend/assetsを想定。
コマンドはVPSへSSH接続したLinuxのシェルで実行してください。
注意：これは配布済みの圧縮JavaScriptを直接書き換える非公式な方法です。ファイル名やコードが異なる版では自動的に停止します。コンテナの再作成・イメージ更新で変更が消える場合があります。
何を変更するか
- モデル一覧を問い合わせる箇所から
limit:100を取り除く。 - OpenRouterの公開モデルAPIをブラウザから取得し、既存の候補と重複を除いて結合する。
1点目は明示的な100件指定を削除する操作です。サーバー側の既定件数や画面側の制限まで解除できるとは限りません。2点目もモデル候補の表示を増やすだけで、利用可能性や料金、APIキーの設定を保証しません。
1. 対象ファイルを確認する
sudo docker exec openhands ls -l /opt/agent-canvas/frontend/assets/llm-settings-BuzF7Un3.js
sudo docker exec openhands ls -l '/opt/agent-canvas/frontend/assets/vendor~entry.client~root~root-layout~index-home~home~conversation-panel~conversation~launch~b0x1wrp2-D_LC-b8J.js'どちらかが存在しない場合、この手順は使えません。次へ進まないでください。
2. バックアップを作成し、構文を確認してから修正する
以下をひとまとまりでコピーします。既に修正済みなら再適用しません。コードが一致しない場合は変更前に停止します。
sudo docker exec -i -u root openhands python - <<'PYCODE'
from pathlib import Path
import subprocess
base = Path('/opt/agent-canvas/frontend/assets')
a = base / 'llm-settings-BuzF7Un3.js'
b = base / ('vendor~entry.client~root~root-layout~index-home~home~'
'conversation-panel~conversation~launch~b0x1wrp2-D_LC-b8J.js')
old_a = '{provider__eq:e,limit:100,page_id:n}'
new_a = '{provider__eq:e,page_id:n}'
old_b = 'async getModels(e){return(await this.client.get(`/api/llm/models`,{params:e?{provider:e}:void 0})).data.models}'
new_b = '''async getModels(e){
const existing=(await this.client.get(`/api/llm/models`,{params:e?{provider:e}:void 0})).data.models;
if(e&&e!=="openrouter")return existing;
try{
const response=await fetch("https://openrouter.ai/api/v1/models");
if(!response.ok)throw new Error("OpenRouter models HTTP "+response.status);
const body=await response.json();
if(!Array.isArray(body.data))throw new Error("Invalid OpenRouter model list");
const additional=body.data.filter(m=>typeof m.id==="string").map(m=>"openrouter/"+m.id);
return [...new Set([...(existing??[]),...additional])];
}catch(error){
console.warn("OpenRouter model list fetch failed:",error);
return existing;
}
}'''
# すべての対象を先に検査し、両ファイルの構文を確認してから反映する。
changes = []
for path, old, new, suffix in (
(a, old_a, new_a, '.before-model-limit'),
(b, old_b, new_b, '.before-openrouter'),
):
source = path.read_text()
if source.count(old) == 1:
backup = path.with_name(path.name + suffix)
if backup.exists():
raise SystemExit(f'{backup}: バックアップが既にあります。中身を確認してください。')
changes.append((path, source, source.replace(old, new, 1), backup))
elif old not in source and new in source:
print(f'{path.name}: 適用済み')
else:
raise SystemExit(f'{path.name}: 対象コードが一致しません。変更せず終了します。')
for path, source, updated, backup in changes:
# 一時ファイルを同じディレクトリに置き、反映前に node で構文検査する。
staged = path.with_name(path.name + '.model-patch-check.js')
try:
staged.write_text(updated)
subprocess.run(['node', '--check', str(staged)], check=True)
finally:
staged.unlink(missing_ok=True)
for path, source, updated, backup in changes:
backup.write_text(source)
path.write_text(updated)
print(f'{path.name}: 修正しました（バックアップ: {backup.name}）')
print('完了。実画面でもモデル候補を確認してください。')
PYCODEエラーが出た場合は表示されたファイル名と内容を確認し、次の操作へ進まないでください。
3. 構文と画面を確認する
sudo docker exec openhands node --check /opt/agent-canvas/frontend/assets/llm-settings-BuzF7Un3.js
sudo docker exec openhands node --check '/opt/agent-canvas/frontend/assets/vendor~entry.client~root~root-layout~index-home~home~conversation-panel~conversation~launch~b0x1wrp2-D_LC-b8J.js'どちらも無表示で終了すれば、JavaScriptの構文検査は成功です。その後、Agent Canvasを再読み込みし、OpenRouterのモデル候補を検索してください。開発者ツールのConsoleにOpenRouter model list fetch failed:が出る場合は、ブラウザから公開APIへの取得に失敗しています。ブラウザの通信制限やCORSも確認してください。
必要なときだけsudo docker restart openhandsを実行します。ブラウザに古いファイルが残る場合は、開発者ツールを開いた状態でキャッシュを無効にして再読み込みします。
元に戻す方法
以下は、修正時に作成されたバックアップがあるファイルだけを復元します。復元後に再読み込みしてください。
sudo docker exec -i -u root openhands python - <<'PYCODE'
from pathlib import Path
base = Path('/opt/agent-canvas/frontend/assets')
for name, suffix in (
('llm-settings-BuzF7Un3.js', '.before-model-limit'),
('vendor~entry.client~root~root-layout~index-home~home~conversation-panel~conversation~launch~b0x1wrp2-D_LC-b8J.js', '.before-openrouter'),
):
path = base / name
backup = path.with_name(name + suffix)
if backup.exists():
path.write_bytes(backup.read_bytes())
print('復元:', name)
else:
print('バックアップなし:', name)
PYCODE補足
OpenRouterのモデルAPIはdata配列にモデルのidを返します。このコードは各IDの先頭にopenrouter/を付けています。APIに新しいモデルが掲載されても、そのモデルをAgent Canvasのバックエンドが実際に利用できるかは別途確認が必要です。
