はじめに
ビジネスチームをリアルタイムの支払い通知でつなげましょう。統合により、支払いイベントがリッチなAdaptive Cardsとして配信されます。これは、Teamsが主要なコラボレーションツールである企業環境に最適です。
このガイドでは、Microsoft TeamsワークスペースでWebhookを作成するための管理者アクセスがあることを前提としています。
始め方
Webhookセクションを開く
Dodo Paymentsダッシュボードで、Webhooks → + エンドポイントを追加に移動し、統合のドロップダウンを展開します。 Microsoft Teamsを選択
Microsoft Teams統合カードを選択します。
Teams Webhookを作成
Teamsで、チャンネル → ⋯ → コネクタ → Incoming Webhook → 設定に移動します。Webhook URLをコピーします。
Webhook URLを貼り付ける
TeamsのWebhook URLをエンドポイント設定に貼り付けます。
変換をカスタマイズ
メッセージをTeams用のAdaptive Cardsとしてフォーマットするために変換コードを編集します。
テストと作成
サンプルペイロードでテストし、作成をクリックしてアクティブにします。
完了!
🎉 あなたのTeamsチャンネルは、Dodo Paymentsの更新をAdaptive Cardsとして受信するようになります。
変換コードの例
基本的な支払いカード
function handler(webhook) {
if (webhook.eventType === "payment.succeeded") {
const p = webhook.payload.data;
webhook.payload = {
type: "message",
attachments: [{
contentType: "application/vnd.microsoft.card.adaptive",
content: {
type: "AdaptiveCard",
body: [
{
type: "TextBlock",
text: "✅ Payment Successful",
weight: "Bolder",
size: "Medium"
},
{
type: "FactSet",
facts: [
{ title: "Amount", value: `$${(p.total_amount / 100).toFixed(2)}` },
{ title: "Customer", value: p.customer.email },
{ title: "Payment ID", value: p.payment_id }
]
}
]
}
}]
};
}
return webhook;
}
サブスクリプション管理
function handler(webhook) {
const s = webhook.payload.data;
switch (webhook.eventType) {
case "subscription.active":
webhook.payload = {
type: "message",
attachments: [{
contentType: "application/vnd.microsoft.card.adaptive",
content: {
type: "AdaptiveCard",
body: [
{
type: "TextBlock",
text: "📄 Subscription Activated",
weight: "Bolder",
color: "Good"
},
{
type: "FactSet",
facts: [
{ title: "Customer", value: s.customer.email },
{ title: "Product", value: s.product_id },
{ title: "Amount", value: `$${(s.recurring_pre_tax_amount / 100).toFixed(2)}/${s.payment_frequency_interval}` },
{ title: "Next Billing", value: new Date(s.next_billing_date).toLocaleDateString() }
]
}
]
}
}]
};
break;
case "subscription.cancelled":
webhook.payload = {
type: "message",
attachments: [{
contentType: "application/vnd.microsoft.card.adaptive",
content: {
type: "AdaptiveCard",
body: [
{
type: "TextBlock",
text: "⚠️ Subscription Cancelled",
weight: "Bolder",
color: "Warning"
},
{
type: "FactSet",
facts: [
{ title: "Customer", value: s.customer.email },
{ title: "Product", value: s.product_id },
{ title: "Cancelled At", value: new Date(s.cancelled_at).toLocaleDateString() }
]
}
]
}
}]
};
break;
}
return webhook;
}
争議アラート
function handler(webhook) {
if (webhook.eventType.startsWith("dispute.")) {
const d = webhook.payload.data;
const color = d.dispute_status === "won" ? "Good" : d.dispute_status === "lost" ? "Attention" : "Warning";
const title = d.dispute_status === "won" ? "🏆 Dispute Won" : d.dispute_status === "lost" ? "❌ Dispute Lost" : "🚨 Dispute Update";
webhook.payload = {
type: "message",
attachments: [{
contentType: "application/vnd.microsoft.card.adaptive",
content: {
type: "AdaptiveCard",
body: [
{
type: "TextBlock",
text: title,
weight: "Bolder",
color: color
},
{
type: "FactSet",
facts: [
{ title: "Payment ID", value: d.payment_id },
{ title: "Amount", value: `$${(d.amount / 100).toFixed(2)}` },
{ title: "Status", value: d.dispute_status },
{ title: "Stage", value: d.dispute_stage }
]
}
]
}
}]
};
}
return webhook;
}
ヒント
- リッチでインタラクティブなフォーマットのためにAdaptive Cardsを使用する
- 適切な色を選択する: 良好(緑)、警告(黄)、注意(赤)
- ファクトセットを簡潔で読みやすく保つ
- デプロイ前にTeamsのWebhookテスターでテストする
トラブルシューティング
- Webhook URLが正しくアクティブであることを確認する
- 変換が有効なAdaptive Card JSONを返すことを確認する
- Webhookがチャンネルに投稿する権限を持っていることを確認する
- TeamsのWebhookテスターでAdaptive Cardスキーマを検証する
- 必要なすべてのフィールドが存在することを確認する
- 色の値が有効であることを確認する(良好、警告、注意、デフォルト)