writing-assistance-apis について
ブラウザー Web アプリに Writing Assistance APIs を組み込むためのスキルです。Summarizer、Writer、Rewriter の選択から、セッション管理やフォールバック、検証までを案内します。
主な機能
- 01ブラウザーアプリの統合箇所を特定
- 02Summarizer、Writer、Rewriterを選択
- 03安全なセッション作成を案内
- 04ストリーミングとキャンセルに対応
- 05フォールバックと検証手順を提示
活用シーン
- 01ブラウザーコンテンツの要約追加
- 02Webアプリでの文章生成や書き換え
- 03モデルの利用可否とダウンロードへの対応
- 04ブラウザーAPI統合の問題調査
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ webmaxru/ web-ai-agent-skills --skill writing-assistance-apisインストール後、Claude Code で/writing-assistance-apisを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
assets/writing-assistance-session.template.tsreferences/compatibility.mdexamples.mdtroubleshooting.mdwriting-assistance-reference.mdscripts/find-writing-assistance-targets.mjs詳細
文章作成支援 API
手順
ステップ 1:ブラウザー連携の対象を特定する
- ワークスペースを調べ、ブラウザーのエントリーポイント、UI ハンドラー、既存の AI 抽象化レイヤーを確認します。
- Node ランタイムが利用できる場合は、
node scripts/find-writing-assistance-targets.mjs .を実行して、該当しそうなフロントエンドファイルと、既存の Summarizer、Writer、Rewriter の使用状況を一覧にします。 - Node ランタイムが利用できない場合は、最も近い
package.json、HTML のエントリーポイント、フレームワークのブートストラップファイルを手動で調べ、ブラウザーアプリの境界を特定します。 - ワークスペースに複数のフロントエンドアプリがある場合は、アクティブなルート、コンポーネント、またはユーザーが指定した機能の対象となるアプリを優先します。
- 一覧を確認してもフロントエンドの候補が複数残る場合は、どのアプリに Writing Assistance API を統合すべきかを尋ね、作業を中断します。
- プロジェクトがブラウザー向けの Web アプリでない場合は、このスキルが適用されないことを説明し、作業を中断します。
ステップ 2:API の実用性を確認し、適切な対象を選ぶ
- コードを書く前に、
references/writing-assistance-reference.mdを読みます。 - ダウンロードの監視、バッチ出力、ストリーミング出力、キャンセルのためにセッションの形式が必要な場合は、
references/examples.mdを読みます。 - プレビュー用フラグ、ブラウザーのチャネル、ハードウェア要件、iframe の制約が関係する場合は、
references/compatibility.mdを読みます。 - 利用可否の確認、作成、ストリーミング、セッションのクリーンアップに失敗した場合は、
references/troubleshooting.mdを読みます。 - 機能がセキュアな
Windowコンテキストで実行されること、および関連する permissions-policy 機能によって現在のフレームからのアクセスが許可されていることを確認します。 - タスクに合う最も用途を絞った対象を選びます。
- 記事、ドキュメント、会話の要約には
Summarizer。 - 短いプロンプトや文章作成タスクから新しいテキストを生成するには
Writer。 - 意図を保ちながら既存のテキストを変換するには
Rewriter。
- 記事、ドキュメント、会話の要約には
- 機能をワーカー内、サーバー上、またはリモートモデルプロバイダーに対して実行する必要がある場合は、プラットフォームが適合しないことを説明し、作業を中断します。
- プロジェクトが TypeScript を使用している場合は、機能で使う特定のブラウザー API を網羅する型定義を追加するか、既存の型定義を維持します。
ステップ 3:ガード付きのセッションラッパーを実装する
assets/writing-assistance-session.template.tsを読み、ワークスペースのフレームワーク、状態モデル、ファイル構成に合わせて調整します。- 実行時に使うものと同じ作成オプションを指定して、API の
availability()メソッドでセッションの作成を制御します。 availability()は機能の利用可否を確認するものであり、ユーザー操作やダウンロード時間なしで作成が成功する保証ではないことを前提にします。- 作成によってダウンロードが始まる可能性がある場合は、ユーザー操作の後にのみセッションを作成します。
- UI でダウンロードの進捗状況を表示する必要がある場合は、
create()でmonitorオプションを使用します。 - キャンセル可能な create 呼び出しと run 呼び出しには
AbortControllerを使用し、セッションが不要になったらdestroy()を呼び出します。 - 作成後にオプションを変更するのではなく、セッションを再作成します。セッションのオプションはインスタンスごとに固定されます。
- 機能がクロスオリジン iframe 内にある場合は、そのフレームが必要とする各 API について明示的な委譲を必須とします。 ステップ 4:UX とフォールバックの動作を組み込む
- API の欠如、デバイスが利用できない状態、モデルのダウンロードが可能または進行中の状態、セッションの準備完了、生成中、処理の中止といった状態を、それぞれ区別して表示します。
- サポート対象外のブラウザー、ブロックされたフレーム、または現在のプレビュー要件を満たさないデバイスでは、AI を使わないフォールバックを維持します。
- レンダリング済みページのコンテンツから取得したテキストを要約または書き換える場合は、その前に HTML を除去または正規化します。
- 続行する前に結果全体が必要な機能ではバッチメソッドを使用し、UI で出力を順次表示する機能ではストリーミングメソッドを使用します。
sharedContextはセッション全体にわたって保持するガイダンスにのみ渡し、呼び出しごとのcontextはリクエスト固有の背景情報にのみ渡します。- 機能がサポート対象の入力言語、コンテキスト言語、または出力言語に依存する場合は、言語オプションを明示します。
- 汎用チャットボット、ツール呼び出し、または自由形式のアシスタントタスクをこれらの API に割り当てないでください。タスクが要約、文章作成、書き換えではない場合は、Prompt API または別の承認済み機能に切り替えてください。
ステップ 5:動作を検証する
node scripts/find-writing-assistance-targets.mjs .を実行し、意図したアプリの境界と API マーカーが、引き続き編集した統合部分を指していることを確認します。- より深いランタイムエラーの調査に進む前に、機能検出、セキュアコンテキストの確認、
availability()の動作を検証します。 - この機能で両方のモードを公開している場合は、少なくとも 1 回のバッチ呼び出しと 1 回のストリーミング呼び出しをテストします。
- キャンセルによって生成が適切に停止し、破棄されたセッションが再利用されないことを確認します。
- 対象環境がプレビュー用ブラウザーフラグやチャンネル固有の動作に依存する場合は、エラーをアプリケーションの不具合と判断する前に、
references/compatibility.mdで必要なブラウザーの状態を確認します。 - 編集後にワークスペースのビルド、型チェック、またはテストを実行します。
エラー処理
Summarizer、Writer、またはRewriterが見つからない場合は、AI を使わないフォールバックを維持し、プロダクトのロジックを変更する前に、環境がブラウザーとプレビューの要件を満たしていることを確認します。availability()がdownloadableまたはdownloadingを返す場合は、生成の準備が整っていると案内する前に、ユーザー操作によるセッション作成を必須とします。create()がNotAllowedErrorをスローする場合は、Permissions Policy の制約、ダウンロードに必要なユーザーアクティベーションの欠如、ブラウザーポリシーによる制限、またはユーザーによる拒否を確認します。create()または実行呼び出しがNotSupportedErrorをスローする場合は、指定した言語、出力形式、要約の種類、トーン、または長さを、ブラウザーがサポートする組み合わせに合わせます。- 呼び出しが
QuotaExceededErrorをスローする場合は、再試行する前にsharedContext、呼び出しごとのcontext、またはユーザー入力を短くします。 - この機能をワーカーまたはサーバーのコンテキストで実行する必要がある場合は、処理を中止し、Writing Assistance API はウィンドウ専用のブラウザー API であることを説明します。
コメント
Markdown 対応