キャラクター自動更新機能
ゲームAPIからキャラクターデータを自動取得し、DB更新・画像ダウンロード・インポート生成までを一括で行う機能。
コマンド一覧
データソース指定(ブラウザ自動化なし)
reseponses/ に配置したJSONファイルを読み込んで処理する。ブラウザは立ち上がらない。
bash
# 全ソース (winrate.json + battle_detail.json + memo.json)
yarn update-characters
# winrate.json のみ
yarn update-characters:winrate
# battle_detail.json のみ
yarn update-characters:detailブラウザ自動化 + 更新
Chrome/Edgeを自動起動し、ゲームサイトからAPIレスポンスを傍受して保存した後、更新パイプラインを実行する。
bash
# 勝率リストページから winrate.json を取得 → 更新
yarn update-characters:fetch
# 試合詳細URLから battle_detail.json を取得 → 更新
yarn update-characters:fetch-detail "https://xzysteam.shengtiangames.com/..."内部フラグ
npx tsx scripts/data/update-characters.ts [オプション]
--fetch ブラウザ自動化で勝率データを取得
--fetch-detail <url> ブラウザ自動化で試合詳細データを取得
--source winrate|detail|memo|all 処理するデータソースを指定 (既定: all)データフロー
[ブラウザ自動化 (--fetch / --fetch-detail)]
↓ APIレスポンス傍受
reseponses/winrate.json / battle_detail.json
↓ yarn update-characters
[差分比較 → characters.json 更新]
↓
[画像ダウンロード (avatar URL → public/images/starward/)]
↓
[imageImports.ts 再生成]データソース
| ファイル | 取得元 | 構造 |
|---|---|---|
winrate.json | 勝率リストAPI | { data: [{ role_code, role: {...} }] } |
battle_detail.json | 試合詳細API | { data: { WinnerDetails: [...], LoserDetails: [...] } } |
memo.json | 従来フォールバック | { data: { WinnerDetails: [...], LoserDetails: [...] } } |
各ファイルの role / Role オブジェクトには code, name_jp, english_name, cost, avatar_link, img_jp 等が含まれる。
ファイル構成
scripts/data/
update-characters.ts # メインパイプライン (DB更新 + 画像DL + imports生成)
fetch-winrate.ts # ブラウザ自動化: 勝率データ取得
fetch-battle-detail.ts # ブラウザ自動化: 試合詳細データ取得
browser-utils.ts # 共通ブラウザユーティリティ (起動・セッション・CDP)
generate-imports.ts # imageImports.ts 自動生成
reseponses/ # データソースJSON (gitignore対象)
winrate.json
battle_detail.json
memo.json
.browser-session/ # ブラウザセッション (gitignore対象)
user-data/ # Chrome user-data-dirブラウザ自動化の仕組み
- CDP (Chrome DevTools Protocol) で Chrome/Edge に接続
- Playwright の
connectOverCDP()を使用 (pipe ではなく WebSocket) - Chrome を
--remote-debugging-portで起動し、WebSocket で通信 - セッションは
--user-data-dirで永続化(2回目以降はログイン不要)
WSL2 対応
--user-data-dirパスを Windows 形式 (C:\...) に自動変換- CDP 接続先に Windows ホスト IP を使用
- Chrome/Edge を WSL パス (
/mnt/c/...) から自動検出
手動でレスポンスファイルを用意する場合
ブラウザ自動化が動かない環境では、手動でJSONファイルを用意できる:
- ブラウザでゲームサイト (https://xzysteam.shengtiangames.com/...) を開く
- DevTools (F12) → Network タブを開く
- 勝率リストまたは試合詳細ページにアクセス
- 該当APIレスポンスを右クリック →「Copy response」
reseponses/winrate.jsonまたはreseponses/battle_detail.jsonとして保存yarn update-characters:winrateまたはyarn update-characters:detailを実行