$30 off During Our Annual Pro Sale. View Details »

ISPやってみた&VoiceflowでもISP / Introduction to Alexa...

ISPやってみた&VoiceflowでもISP / Introduction to Alexa's In-Skill Purchase with ASK-SDK and Voiceflow

【大阪】スマートスピーカーミーティング 2019/09/26 のLTの資料です。Alexaのスキル内課金をやってみた感想とかまとめてます。もちろんリリースされたばかりのVocieflowのスキル内課金もご紹介してます!

https://osaka-driven-dev.connpass.com/event/145580/

Kuniaki Shimizu

September 26, 2019
Tweet

More Decks by Kuniaki Shimizu

Other Decks in Technology

Transcript

  1. My Skills & Actions 6 - Alexa (JP): 12 -

    Google: 1 - Clova: 1 #スキル開発100チャレンジ - Alexa (US): 1
  2. (個人的)ISP実装のポイント 10 • 実装はそんなに難しくない ◦ 購入処理はAlexa側でやってくれる ◦ スキル側はISPのAPIに投げて受けるだけ ◦ 購入処理中の応答もAlexa側で予め用意

    • スキル開発者がやることはその外側 ◦ 購入前はBuyとUpsellで課金につなげる ◦ 購入後は会話フローにスムーズに戻す ◦ 購入有無をチェックして処理を分岐 ◦ セッション1回きれるので考慮 会話の流れが作るのが重要
  3. (個人的)ISP実装のポイント 11 • 実装はそんなに難しくない ◦ 購入処理はAlexa側でやってくれる ◦ スキル側はISPのAPIに投げて受けるだけ ◦ 購入処理中の応答もAlexa側で予め用意

    • スキル開発者がやることはその外側 ◦ 購入前はBuyとUpsellで課金につなげる ◦ 購入後は会話フローにスムーズに戻す ◦ 購入有無をチェックして処理を分岐 ◦ セッション1回きれるので考慮 会話の流れが作るのが重要
  4. 12 課金 処理前 課金 処理中 課金 処理後 購入インテントトリガー ディレクティブ送信 (type=Connections.SendRequest)

    購入インテントハンドラ レスポンスハンドラ (type=Connections.Response) getResponseで会話フロー をつなげる 商品・料金説明、 同意確認 認証コード確認 課金処理 • スキル側でやるのは購入処理の手前と後だけ • 購入処理も一連のやり取りもAlexa⇔ユーザでやってくれる スキル内課金のやりとり セッション切断
  5. 15 MonetizationServiceClient • 購入をMonetizationServiceClientにリクエスト const BuyEnglishPackIntentHandler = { ・・・ handle(handlerInput)

    { const locale = handlerInput.requestEnvelope.request.locale; const ms = handlerInput.serviceClientFactory.getMonetizationServiceClient(); return ms.getInSkillProduct(locale, ENGLISH_PACK_ID).then(function (product) { if (product.entitled === "ENTITLED") { const speechText = `既に${product.name} を購入しています。続けますか?`; const repromptText = `続けますか?`; return handlerInput.responseBuilder .speak(speechText) .reprompt(repromptText) .getResponse(); } else { return handlerInput.responseBuilder .addDirective({ type: 'Connections.SendRequest', name: 'Buy', payload: { InSkillProduct: { productId: ENGLISH_PACK_ID } }, token: 'correlationToken' }) .getResponse(); } }); } };
  6. 16 MonetizationServiceClient • 購入処理結果を受けるハンドラ const BuyResponseHandler = { canHandle(handlerInput) {

    return handlerInput.requestEnvelope.request.type === 'Connections.Response' && ・・・ }, handle(handlerInput) { const locale = handlerInput.requestEnvelope.request.locale; const ms = handlerInput.serviceClientFactory.getMonetizationServiceClient(); return ms.getInSkillProduct(locale, ENGLISH_PACK_ID).then(function (product) { if (handlerInput.requestEnvelope.request.status.code === '200') { let speechText = product.summary; const repromptText = '続けますか?'; switch (handlerInput.requestEnvelope.request.payload.purchaseResult) { case 'ACCEPTED': // 購入した speechText = product.summary + repromptText; break; case 'DECLINED': // 購入しなかった speechText = repromptText; break; case 'ALREADY_PURCHASED': // 既に購入済 speechText = product.summary + repromptText; break; Default: // その他のERROR speechText = `うまく行かなかったようです。${repromptText}`; break; } ・・・続く・・・
  7. (個人的)ISP実装の印象 17 • 実装はそんなに難しくない ◦ 購入処理はAlexa側でやってくれる ◦ スキル側はISPのAPIに投げて受けるだけ ◦ 購入処理中の応答もAlexa側で予め用意

    • スキル開発者がやることはその外側 ◦ 購入前はBuyとUpsellで課金につなげる ◦ 購入後は会話フローにスムーズに戻す ◦ 購入有無をチェックして処理を分岐 ◦ セッション1回きれるので考慮 会話の流れが作るのが重要
  8. 21 購入処理の結果とメッセージ ACCEPTED → 購入確認で   「はい」 DECLINED → 購入確認で

      「いいえ」 ERROR → 購入処理で   エラー ALREADY_PURCHAS ED→ 購入済(二重購 入) 買い切り はい、 ◦◦◦の購入処理 が完了しました わかりました “支払い方法が正しく設 定されていません。 Alexaアプリに設定画面 へのリンクを送信しました ので、そちらで確認してみ てください。” “すみません、うまく処 理できません。” “すみません。◦◦◦はご 使用の国では利用でき ません。” “すみません、このデバ イスではスキル内課金 を行うことができませ ん。” ◦◦◦はすでにお持ち です サブスク リプション はい、 ◦◦◦を使用でき ます はい、わかりました。 ◦◦◦に申し込みたい時 は、いつでも言ってくだ さい。 消費 はい、 ◦◦◦の購入処理 が完了しました わかりました ー ※消費型では発生  しない(はず) • 結果は購入処理中に応答される。スキルでは返さない。
  9. 22 キャンセル処理の結果とメッセージ ACCEPTED → キャンセル確認で   「はい」 DECLINED → キャンセル確認で

      「いいえ」 ERROR → キャンセル処理   でエラー NOT_ENTITLED →未購入 買い切り 返金については、Alexaアプ リにリンクを送信しましたの で、そちらで確認してくださ い。 ー ※確認がない ※買い切りの場合は  返金処理になる  即時対応ではない ? ◦◦◦はまだ追加されていない ようです。 ※Cancelリクエストの  手間で返されている  ように見える サブスク リプション はい、サブスクリプションを キャンセルしました。今後会 費が請求されることはありま せん。会費を支払い済みの 期間が終了するまでは引き 続き利用できます。 はい、ではキャンセルしない でおきます。 サブスクリプションには現在 会員登録していないようで す。 Alexaアプリに会員登録 の設定画面へのリンクを送信 しましたので、そちらで確認し てみてください。 消費 ? ? ? • 結果は購入処理中に応答される。スキルでは返さない。
  10. ISPの難しいところ 23 • 会話の流れがつかみにくい ◦ 購入はトランザクション、麺より線のイメージ ◦ 購入処理中のやりとりが見えないところで会話を つなぐ必要 ◦

    Upsellとか作り方によっては複雑になりがち • コードとフローが直感的にマッチしにくい ◦ 通常のインテント ◦ 購入用インテント(Buy, Upsell, Cancel) ◦ MonetizationServiceClientからのレスポンス • 購入処理時、セッション切れるので要対応 全体的に見えにくくなりがち
  11. ISPの難しいところ 28 • 会話の流れがつかみにくい ◦ 購入はトランザクション、麺より線のイメージ ◦ 購入処理中のやりとりが見えないところで会話を つなぐ必要 ◦

    Upsellとか作り方によっては複雑になりがち • コードとフローが直感的にマッチしにくい ◦ 通常のインテント ◦ 購入用インテント(Buy, Upsell, Cancel) ◦ MonetizationServiceClientからのレスポンス • 購入処理時、セッション切れるので要対応 全体的に見えにくくなりがち
  12. 32

  13. VoiceflowのISP Pros&Cons 38 • 課金処理はPayment Block/Cancel Payment Block 使うだけ ◦

    課金処理のリクエスト・レスポンス気にしなくてOK ◦ 純粋なインテントを作っていけば良い • 購入チェックはUser Info Block使うだけ • 永続ストレージは変数でかんたんに扱える ◦ プロジェクト変数はデフォルトで永続 • 会話の流れがわかりやすい ◦ フローなのでBuyやUpsellの流れが見える ◦ フロー外からもIntent Blockで対応 Pros:
  14. VoiceflowのISP Pros&Cons 39 • それでもフローはやっぱり見にくくなる ◦ 線がたくさん交差しがち ◦ 並べ方に工夫が必要 •

    現時点で公式ドキュメントゼロ ◦ 今あるドキュメントはもう古い ◦ 何に使うのかよくわからない項目とかもある • 細かい動きわからない ◦ 結局、Alexa公式のドキュメント見る ◦ 一回コード書いて体験しないとフロー作れない Cons:
  15. 43 おさらい:商品タイプ • “One-Time Purchase(買い切り型)” ◦ 永久に使える「権利」を買うイメージ ◦ プレミアム機能の有効化とか •

    “Subscription(サブスクリプション型)” ◦ 支払っている期間は使える、やめれば使えない ◦ 月額サービス利用 • “Consumable(消費型)” ◦ 使ったらなくなる、何個でも買える ◦ ゲームのアイテムとか
  16. 44 おさらい:商品タイプ • “One-Time Purchase(買い切り型)” ◦ 永久に使える「権利」を買うイメージ ◦ プレミアム機能の有効化とか •

    “Subscription(サブスクリプション型)” ◦ 支払っている期間は使える、やめれば使えない ◦ 月額サービス利用 • “Consumable(消費型)” ◦ 使ったらなくなる、何個でも買える ◦ ゲームのアイテムとか
  17. 45 • 現在の商品の保有数はスキル側で管理 ◦ 購入処理結果で増減を管理する必要あり ◦ MonetizationServiceClientは購入数のみ管理 ◦ 永続ストレージ必須 •

    複数アイテムパックのキャンセル注意 ◦ 5個パック等 ◦ MonetizationServiceClientが管理する購入数は パック単位 ◦ キャンセルも同じ、商品の数ではない • RequestInterceptor使って常に管理 • スキル有効・無効でも引き継がれる(userId変わらない) ◦ スキルイベントでも考慮 消費型に注意