TwilioPay(電話でペイ)で勉強会の会費を徴収してみた

#この記事は
Twilio Advent Calendar 2018の12月16日分の投稿です。
昨日は、@mobilebizさん「Twilio FlexでLINE Channelを連携させる方法」でした。

#Twilio Payとは
2018年10月にサンフランシスコで開催されたTwilioのビックイベント「SIGNAL」で発表された、音声通話でクレジットカード決済をするための機能です。PCI DSS基準を満たす決済システムを簡単に導入できる機能です。

詳しくはTwilioエバンジェリスト高橋さんのQiita記事で紹介されてますので、そちらをご覧いただくのが確実です。作り方も画像付きで説明されているのでわかりやすいです。
ちなみに、現在は、stripeのみの利用となっていますが、<Pay> Connectorsというくらいだから、今後はstripe以外も使えるようになるといいなと思っています。(個人の感想です)

#ざっくり作ってみました。
先日開催しました【TwilioJP-UG 岡山 #2】Twilio SIGNAL報告会 in OKAYAMAにて、ハンズオンを実施し、そこで実装しました。
ほぼ、高橋さんのQiita記事でやっていることとほとんど同じなのですが、クレジット決済の結果を取得し、電話でお伝えするようにしてみました。
##着電時のTwiML(TwiML Binsで実装)
ポイントは、<pay>動詞にactionに、結果を通知する先を指定することです。

<?xml version="1.0" encoding="UTF-8"?>
<Response>
  <Say language="ja-JP">勉強会のご参加ありがとうございます。本日の会費は300円です。</Say>   
  <Pay chargeAmount="300" currency='jpy' action="[ここに通知先を指定]" postalCode="false" paymentConnector="default">
    <Prompt for="payment-card-number">
      <Say language="ja-JP">クレジットカード番号を入力してください。</Say>
    </Prompt>    
    <Prompt for="expiration-date">
      <Say language="ja-JP">有効期限を、月と年のそれぞれ2桁の数字で入力してください。</Say>
    </Prompt>    
    <Prompt for="security-code">
      <Say language="ja-JP">セキュリティーコードを入力してください。カードの裏に記載されています。</Say>
    </Prompt> 
  </Pay>
</Response>

##結果を受け取る（Twilio Functionsで実装）
上記、「ここに通知先を指定」について、今回は、Twilio Functionsで実装しました。
※自身のWebサーバーで受けることも可能です。
※TwilioFunctionの場合だと、PropertiesのPATHの値を、上記actionに指定します。

exports.handler = function(context, event, callback) {
  let twiml = new Twilio.twiml.VoiceResponse();

  switch (event.Result) {
    case "success":
      text = "会費300円の決済が完了しました。ご利用ありがとうございました。";
      break;

    case "payment-connector-error":
      text = "エラーが発生しました。決済に失敗しました。";
      console.log(decodeURIComponent(event.PaymentError));
      break;
    
    default: 
        text = "決済に失敗しました。";
    }
    twiml.say({ language: 'ja-JP' },text);
    callback(null, twiml);
};

こちら、POSTで呼び出されるのですが、パラメータとしては以下のようなものが設定されていました。
※2018年12月16日現在
※決済関連だけ赤字にしました。その他は通常の着信と基本的に同じ。
※詳しくは仕様をご確認ください。

パラメータ	説明 (個人の感想です)	値
AccountSid	TwilioのAccountSid	AC******************************
ApiVersion	TwilioのいつものApiVersion	2010-04-01
Called	決済に利用したTwilio側の電話番号(E.164形式)	+8150********
CalledCity	受信者情報(地域)	空文字
CalledCountry	受信者情報(国)	JP
CalledState	受信者情報(状態)	空文字
CalledVia	受信者情報(電話番号)	050********
CalledZip	受信者情報(Zip)	空文字
Caller	発信者情報(電話番号 E.164形式)	+8190********
CallerCity	発信者情報(地域)	空文字
CallerCountry	発信者情報(国)	JP
CallerState	発信者情報(状態)	空文字
CallerZip	発信者情報(Zip)	空文字
CallSid	CallSid	CA******************************
CallStatus	通話の状態	in-progress
Direction	発着信の種別	inbound
ExpirationDate	クレジットカード有効期限	YYMM
ForwardedFrom	Twilio番号	050********
From	発信者情報(電話番号 E.164形式)	+8190********
FromCity	発信者情報(地域)	空文字
FromCountry	発信者情報(国)	JP
FromState	発信者情報(状態)	空文字
FromZip	発信者情報(Zip)	空文字
PaymentCardNumber	クレジットカード番号(下4桁以外マスク)	xxxxxxxxxxxx0000
PaymentCardPostalCode	ZIPコード(入力させてない)	空文字
PaymentCardType	クレジットカードの種類	mastercardとかvisaとか
PaymentConfirmationCode	決済確認コード(stripe側のコード)	ch_********************yzf
PaymentError	決済エラー情報	空文字。エラーだったら入る？
PaymentToken	決済トークン	空文字
Result	決済結果	success
SecurityCode	クレジットカードのセキュリティー番号。常に"xxx"	xxx
To	決済に利用したTwilio側の電話番号(E.164形式)	+8150********
ToCity	受信者情報(地域)	空文字
ToCountry	受信者情報(国)	JP
ToState	受信者情報(状態)	空文字
ToZip	受信者情報(Zip)	空文字
特に、PaymentConfirmationCodeを取得することができ、これが、stripeの管理画面の以下の値と一致しています。
これらの値を利用すれば、他システムと連携できたり、決済後SMSで領収書のURLを送付できたりと、いろいろできそうです。

#会費を徴収してみました。
2018年12月15日に開催しましたJP_Stripes Okayama #1にて徴収してみました。

セミナー中にみんなで電話！
会場費を電話クレジット決済(TwilioPay+Stripe)でお支払いいただきました！#JP_Stripes pic.twitter.com/AoOpOgwusX

— takeshi.furusato (@t_furusato) 2018年12月15日

未だかつてない空気感での会費徴収が斬新でしたね。

ちなみに、徴収した金額はStripeの管理画面で確認することができます。
上記stripeの画面キャプチャ参照。左メニューの「支払い」で表示されます。

また、支払い側のクレジットカード利用明細には、
ST [明細書表記欄に入力された値]
となります。左メニューのビジネス設定のクレジットカードの明細書欄に、お客様にわかりやすいちゃんとしたものを設定しておくことが大事。

なお、ご利用費用は、、、
Twilioは、1決済につき、15円。決済が成功した場合にのみ課金。チャージから引き落とし。
Stripeは、決済金額の3.6%が手数料として課金。1決済ごとの入金金額から差し引かれます。

#まとめ
いままで、電話決済を作ろうとすると、こんなに簡単に実装はできなかったはず。
TwilioPayとStripeでこの電話決済が非常に身近になったと思います。
日本円で決済できるようになったのも魅力的。
今後、Stripe以外も連携をすると思いますので、そちらにも期待ですね(個人の感想です)
調べてみたのですが、まだ、Twilio Studioにはなさそうだったので、そちらに導入されることも期待しています。TwilioFlexとの連携なども今後試してみたいです。

明日は@sh-ogawaさんの「Twilioに追加されたPolly連携が有用なのかをドキュメントからまとめた」です。
Twilio Advent Calendar 2018