コンテンツにスキップ
todoke docs

はじめに

todoke を使って Web Push 通知を送るまでの手順を説明します。

使い方は 3 通り

Section titled “使い方は 3 通り”

todoke には用途に応じて 3 つの使い方があります。

方法最短手順詳細ページ
ダッシュボードブラウザで登録・ログインし、画面からアプリ作成/購読状況/統計を確認するアカウント登録とログイン
CLItodoke login → todoke notifyCLI
API / SDKAPI キーを発行し POST /api/v1/notify を呼ぶ（本ページで説明）本ページ／TypeScript SDK

CLI での最短手順は次のとおりです（full スコープのキーでログイン済みの前提）。

Terminal window
todoke login --api-key pk_full_key
todoke notify <app-id> -t "テスト通知" -b "送信成功！"
# ※ <app-id> は現在の実装では参照されず、送信先はログイン中のキーに紐づくアプリで決まります

以降のクイックスタートでは、ダッシュボードと API / SDK を使った手順を説明します。

クイックスタート

Section titled “クイックスタート”

  1. アカウントを作成する

    todoke ダッシュボード にアクセスし、メールアドレスとパスワードで登録するか、GitHub アカウントでログインします。

  2. アプリを作成する

    ダッシュボードの「新しいアプリを作成」からアプリ名を入力します。作成すると VAPID 公開鍵が自動生成されます。

  3. API キーを発行する

    アプリ詳細画面の「API Keys」セクションでキーを作成します。用途に合わせてスコープを選択してください。

    • subscribe_only — フロントエンドへの埋め込み用（購読登録のみ）
    • notify — サーバーサイドからの通知送信用
    • full — 全操作可能な管理用キー

  4. フロントエンドに購読登録を実装する

    取得した VAPID 公開鍵と subscribe_only キーを使い、ブラウザから購読を登録します。

    import { PushCF } from "@todoke/sdk";
    

    const client = new PushCF({
      apiKey: "pk_subscribe_only_key",
    });
    

    const registration = await navigator.serviceWorker.ready;
    await client.subscribe({ registration }); // Push 購読を登録

  5. 通知を送信する

    サーバーサイドから notify スコープのキーで通知を送ります。

    Terminal window
    curl -X POST https://api.todoke.dev/api/v1/notify \
      -H "Authorization: Bearer pk_notify_key" \
      -H "Content-Type: application/json" \
      -d '{"title":"テスト通知","body":"送信成功！"}'

次のステップ

Section titled “次のステップ”