--- type: article title: kototoi 問い合わせフォーム profile: sorane-okf/0.1 excludeFromList: true --- [sorane](https://ssg.sorane.dev) 静的サイトに [kototoi](https://github.com/masanork/kototoi)（Passkey 問い合わせ）を埋め込む手順と運用メモです。 ## 構成 | ホスト | 役割 | |--------|------| | `ssg.sorane.dev`（Pages） | 静的 HTML・`kototoi-form.js` / `.css`（同一オリジン） | | `ask.sorane.dev`（Worker） | API・管理 UI・D1 | フォーム JS は sorane ビルド成果物に同梱し、API 呼び出しだけ `ask.sorane.dev` 向けになります（CORS + `credentials: 'include'`）。Passkey の `rpId` は親ドメイン `sorane.dev` です。 ``` ssg.sorane.dev/contact → kototoi-form.js（同一オリジン） → fetch → ask.sorane.dev/api/... ``` ## `sorane.yaml` ```yaml site: base_url: https://ssg.sorane.dev contact: page: contact.html # llms.txt・発見性メタ用 kototoi: endpoint: https://ask.sorane.dev site_id: "" form: title: お問い合わせ intro: ご質問は下記からお送りください。 submit_label: 送信する fields: - id: name label: 氏名 type: text required: true max_length: 200 - id: subject label: 件名 type: text required: false max_length: 200 placeholder: 任意（一覧の表示名になります） - id: body label: お問い合わせ内容 type: textarea required: true max_length: 8000 ``` - `endpoint` / `site_id` … kototoi Worker 側でサイト登録した値（全テナント共通の `ask.sorane.dev` でよい） - `form` … ビルド時に `dist/kototoi-form.json` へ書き出し、クライアントが読み込む - `subject`（件名）… 任意。入力するとスレッド一覧の表示名になる。未入力時は日付ベースのラベル（氏名は使わない） - `site.base_url` と `site_id` の組は kototoi の `allowed_origins` と一致させる ## コンテンツ問い合わせページ（例: `content/contact.md`）にプレースホルダを置きます。 ```markdown --- title: お問い合わせ type: article --- Passkey で認証します。 ``` ビルド後スクリプトが `` を `

` に差し替え、`` / `` 直前に CSS・JS を注入します（Markdown 内の `