WebプッシュWebhook

​

概要

• リアルタイムで通知エンゲージメントを追跡
• ユーザーインタラクションに基づいて自動ワークフローをトリガー
• 通知データを分析プラットフォームと同期
• 通知イベントのカスタムビジネスロジックを実装

​

ブラウザーサポート

​

利用可能なWebhookイベント

​

notification.willDisplay

​

notification.clicked

​

notification.dismissed

​

セットアップ方法

• ダッシュボード設定（ほとんどのユーザーに推奨）
• カスタムコード統合

1

OneSignalダッシュボードでSettings > Webに移動します

2

「Enable webhooks」トグルを有効にします

3

追跡したい各イベントのWebhook URLを入力します

既存のOneSignal.init()メソッドにWebhook設定を追加します：

コピー

AIに質問

// 既存のOneSignal初期化に追加 - initを2回呼び出さないでください
OneSignal.init({
  // ここに他の既存設定
  webhooks: {
    cors: false, // 推奨：カスタムヘッダーが必要でない限りfalseのままにします
    'notification.willDisplay': 'https://yoursite.com/webhook/display',
    'notification.clicked': 'https://yoursite.com/webhook/click',
    'notification.dismissed': 'https://yoursite.com/webhook/dismiss' // Chromeのみ
  }
});

​

CORS設定

• cors: false（推奨）： よりシンプルなセットアップ、サーバーでのCORS設定は不要
• cors: true： 追加のヘッダーを提供しますが、サーバーでのCORSサポートが必要

• Content-Type: application/jsonヘッダーが必要
• イベントの識別を容易にするためにX-OneSignal-Eventヘッダーが必要
• サーバーがすでに非シンプルリクエストのCORSをサポートしている

​

Webhookリクエスト形式

​

標準リクエスト（cors: false）

{
  "event": "notification.clicked",
  "notificationId": "ed46884e-0e3f-4373-9e11-e28f27746d3d",
  "heading": "Your notification title",
  "content": "Your notification message",
  "additionalData": {
    "userId": "12345",
    "campaignId": "summer-sale",
    "customField": "customValue"
  },
  "actionId": "buy-now-button",
  "url": "https://yoursite.com/product/123"
}

​

拡張リクエスト（cors: true）

Content-Type: application/json
X-OneSignal-Event: notification.clicked

​

ペイロードフィールドリファレンス

​

実装のベストプラクティス

​

Webhookエンドポイントの要件

• HTTPS URLのみを使用（HTTP URLはChromeによってブロックされます）
• Webhookエンドポイントに適切な認証/検証を実装
• 大量の通知を処理するためにレート制限を検討

• 処理が成功した場合はHTTP 200ステータスを返す
• タイムアウトを避けるために10秒以内に応答
• 重複するWebhook呼び出しを適切に処理（冪等性を実装）

​

エラーハンドリング

// Example webhook endpoint (Node.js/Express)
app.post('/webhook/notification', (req, res) => {
  try {
    const { event, notificationId, additionalData } = req.body;

    // Validate required fields
    if (!event || !notificationId) {
      return res.status(400).json({ error: 'Missing required fields' });
    }

    // Process the webhook data
    processNotificationEvent(req.body);

    // Always respond with 200 OK
    res.status(200).json({ success: true });
  } catch (error) {
    console.error('Webhook processing error:', error);
    res.status(500).json({ error: 'Internal server error' });
  }
});

​

よくある問題と解決策

​

Webhookが発火しない

• OneSignal初期化を含むすべてのページにWebhookコードが存在しない
• Webhookコードが追加された後、ユーザーがWebhookコードを含むページにアクセスしていない
• HTTPS要件が満たされていない
• サーバーが200以外のステータスコードを返している

​

Webhookでデータが欠落

​

重複するWebhook呼び出し

​

Webhookの制限事項

• イベントごとに1つのWebhook URL： 同じイベントタイプに複数のWebhook URLを設定することはできません
• HTTPSのみ： ブラウザーのセキュリティ制限により、HTTP URLは機能しません
• Chromeのみの却下追跡： notification.dismissedイベントはChromeでのみ機能します
• ページ依存性： 追跡が機能するには、ユーザーがWebhookコードがアクティブなページにアクセスする必要があります

​

Webhookのテスト

1. テスト通知を送信 OneSignalダッシュボードから
2. Webhookエンドポイントを監視 受信リクエストを確認
3. ペイロード構造を検証 期待と一致するかを確認
4. さまざまなシナリオをテスト：
   • 通知の表示
   • 通知本文のクリック
   • アクションボタンのクリック（設定されている場合）
   • 通知の却下（Chromeのみ）

​

次のステップ

• 分析統合： Webhookデータを分析プラットフォームに転送
• ユーザーセグメンテーション： Webhookイベントを使用してエンゲージメントに基づくユーザーセグメントを作成
• 自動化されたワークフロー： プッシュ通知のインタラクションに基づいてメールキャンペーンまたはアプリ通知をトリガー
• A/Bテスト： Webhookデータを使用してさまざまな通知戦略の効果を測定