この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
はじめに
こんにちは、中村です。
最近LINEボットにてLINE Payを利用した決済を行う仕組みを構築しています。構築を進めるにあたってLINE Payにて決済を行なった後にトークへ戻りたいニーズがあると思います。今回は改善にあたり実施したものをまとめておきます。
決済後フローを改善する
リクエストのConfirmUrlTypeとレスポンスのpaymentUrlの2つで体験が違います。今回のニーズには下記の条件時に対応が可能です。
- ConfirmUrlType=CLIENT かつ paymentUrl=webの場合
- ConfirmUrlType=SERVER かつ paymentUrl=appの場合
ConfirmUrlType=CLIENT かつ paymentUrl=webの場合
決済完了後、ConfirmUrlに指定したアドレスに遷移します。遷移先の画面は閉じないので、友達追加リンクを用意します。すでに友達になっている場合は、トークへ遷移することができます。サーバーレスで仕組みを作成するとこのようになります。
API Gatewayは、下記の設定を行います。
Lambdaではレスポンスをこのような形で指定します。
exports.handler = async(event) => {
transactionIdを仕様して確定処理など....
:
:
:
let response = {
isBase64Encoded: false,
statusCode: 301,
headers: {
Location: 'HOSTING_BUCKET' //index.htmlのURLを入れる
},
body: ''
};
return response;
}
友達追加のリンクは、LINE@ MANAGERの基本設定にある友だち追加ボタンで記載されているURLを利用してください。
体験を確認してみる
ConfirmUrlType=SERVER かつ paymentUrl=appの場合
flowTypeプロパティに"HIDE_PAY_SCREEN"を指定すると、決済完了後、LINE Payの画面が閉じます。(ドキュメントには記載がありませんが、動作をすることができました。)
リクエストボディ
let paymentInfo = {
productName: 'コーヒー',
amount: 10,
currency: 'JPY',
confirmUrl: 'CONFIRM API HERE',
confirmUrlType: 'SERVER',
orderId: '01',
flowType: "HIDE_PAY_SCREEN"
};
レスポンス
{
"returnCode": "0000",
"returnMessage": "Success.",
"info": {
"paymentUrl": {
"web": "https://web-pay.line.me/web/payment/wait?xxxxxxxx",
"app": "line://pay/payment/xxxxxxxxx"
},
"transactionId": 00000000000,
"paymentAccessToken": "0000000000"
}
}
体験を確認してみる
まとめ
今回は決済後のフローをいくつかまとめました。LINEボットの体験では決済後のフローも重要なので改善に役立てば幸いです。
チャットボット開発は弊社にご相談ください。
またAmazon Connectのキャンペーンを行なっております。こちらもご相談お待ちしております。