Alternative Architecture DOJO

オルターブースのクラウドネイティブ特化型ブログです。

自作で見守りカメラを作ってみたかった男のPayPay決済開発

こんにちは、この記事投稿日が誕生日のオルターブース エンジニア ふるのです。

この記事はオルターブース Advent Calendar 2020の20日目の記事です。

adventar.org

今回は誕生日ということで、個人的に前々から作ってみたかった見守りカメラをせっかくなので記事としても書いてみよう。
っと思ったわけですが、準備してたラズパイ Zero WHがまさかの不良品。
Wifiチップが見つかりませんと言われ、色々試すが何もすることができず、記事も2日後投稿...
ヤバいヤバいと思いつつ、娘と見るうみなかキャンドルナイトは綺麗でした('ω')

うみなかキャンドルナイト2020|海の中道海浜公園uminaka-park.jp

昨日今日と二日間だけなので、興味がある方は来年是非!(防寒対策万全に)

ということで、急遽ネタ変更! 最近話題?のPayPay決済を特急でお届けします。

www.alterbooth.com

準備するもの

  • PayPay for Developersのアカウント作成
  • スマホ(アプリ)
  • PHPが動く環境(ローカルでもOK)

これだけ。 まずは下準備

PayPay for Developersのアカウント作成

開発にはPayPay for Developersのアカウントが必要なので、まずはアカウントを作成します。

こちらから https://developer.paypay.ne.jp/account/signup

アカウント作成が終わったらダッシュボードに行き、以下の情報を確認します。

  • PayPay関連の各情報
    • MERCHANT ID
    • APIキー
    • シークレット
  • テストユーザー

MERCHANT IDはちょっとわかりにくいですが、左上の「FU」というところをクリックすると出てきます。

開発中のテスト決済ではテストユーザーでのログインが必須になるので、切り替えが面倒な人はパスワードなどをスマホに記憶させておくと楽です。(私は1パスに記憶させました)

スマホ(アプリ)

無くてもなんとかなりますが、今回はアプリで決済するので準備。

Google Play or App Storeからダウンロード Google Play / App Store

ダウンロードが完了したらアプリを起動。
ログイン画面へ移動したことを確認して、左上のPapPayロゴを7回タップします。
すると開発者モードに切り替えるか確認のポップアップが出るので、同意します。

開発者モードのログイン画面へ移動したら、アカウント作成時に確認したテストユーザーでログイン。
SMS認証が要求されますが、テストユーザーの電話番号なんて知らないのでPayPayに連絡.....はしません。

テストユーザーは「1234」で統一されていますので、さくっと入力。

ログインできたら画面上部に開発者モードでログインしていることを知らせる注意文のようなものがあるのを確認します。
※無かったら通常モードでログインしている状態なので、ログアウトして切り替えてください

アプリ側の準備は以上です。

最近開発者モードでログインしてると通信エラーとかでよくログアウトされるのなんとかならないですかね

実装

SDKの中には色々な機能があります。
実装前にどの機能が必要なのかを決めてから実装しましょう。

developer.paypay.ne.jp

今回はPHP環境でウェブペイメントをテストします。

各SDKはgithubに公開されているので、そちらも参考してみてください。

github.com

公式サイトのドキュメントにもサンプルコードがあるので、そちらも参考に。

developer.paypay.ne.jp

それでは実際にやっていきましょう。

SDKをインストール

composerを使ってインストールします。

composer require paypayopa/php-sdk

クライアント作成

$client = new Client([
  'API_KEY' => 'YOUR_API_KEY',
  'API_SECRET'=>'YOUR_API_SECRET',
 'MERCHANT_ID'=>'YOUR_MERCHANT_ID' 
],false); //Set True for Production Environment. By Default this is set False for Sandbox Environment.

一番下のboolean値はtrueにすると本番環境のAPIへアクセスしようとするので、開発中は変更しないでください。
本番環境にはテストユーザーでアクセスできないので、大丈夫だとは思うのですが念のため...

決済用QRコード作成

// setup payment object
$CQCPayload = new CreateQrCodePayload();

// Set merchant pay identifier
$CQCPayload->setMerchantPaymentId("YOUR_TRANSACTION_ID" . $_GET["rmnum"]);

// Log time of request
$CQCPayload->setRequestedAt();
// Indicate you want QR Code
$CQCPayload->setCodeType("ORDER_QR");

// Provide order details for invoicing
$OrderItems = [];
$OrderItems[] = (new OrderItem())
    ->setName('Cake')
    ->setQuantity(1)
    ->setUnitPrice(['amount' => 1, 'currency' => 'JPY']);
$CQCPayload->setOrderItems($OrderItems);

// Save Cart totals
$amount = [
    "amount" => 1,
    "currency" => "JPY"
];
$CQCPayload->setAmount($amount);
// Configure redirects
$CQCPayload->setRedirectType('WEB_LINK');
$CQCPayload->setRedirectUrl('YOUR_REDIRECT_URL');

// Get data for QR code
$response = $client->code->createQRCode($CQCPayload);

ほぼドキュメント通りのソースコードです。
少しだけ補足。

  • YOUR_TRANSACTION_IDとYOUR_REDIRECT_URLは各自任意の情報に変更してください。
    • YOUR_TRANSACTION_IDはダッシュボードで確認した値
    • YOUR_REDIRECT_URLは決済後にリダイレクトするページ(決済完了画面など)
      • ※なお、決済完了後すぐにアプリを閉じるとこのリダイレクトが実行されないので、表示されなくても問題ない設計が必要
  • setMerchantPaymentIdの引数に $_GET["rmnum"] と追加していますが、MerchantPaymentIdは重複できないため、テスト中のURLに乱数やGUIDを設定し、それを追加することで重複しないようしました。(楽にテストするためです!)

これで $response に200でレスポンスが返ってくれば最低限の実装は完了です。
エラーコードで返ってくる場合は、APIキーが違ったり、リクエスト値が不足していたりする場合があるので、そのあたりを一度確認してみてください。

決済を実行するにはレスポンス値にある redirectUrl or deeplink で作成されているURIを使用します。
この二つの違いですが、

  • redirectUrl
    • ブラウザ上でも決済できる
    • Androidの場合はアクセスした時点でブラウザで開くか、アプリで開くかを選択可能
    • iPhoneの場合は何も聞かれずブラウザを開きます
  • deeplink
    • PayPayアプリを起動するスキームが設定されている
    • 必ずアプリが起動

redirectUrl はブラウザでログインして決済を行えるのでスマホだけでなく、パソコンでも決済が可能となるため、どちらを使うかは状況に応じて使い分けるのが良いかと思います!

以上、PayPay決済のデモ風でした。

急遽ネタを変えたので文字多めで読みにくくてすみません...
後日スクショも撮って見易くする...かも...しない...かも....

最後にソース全体を貼っておきます。
※githubに記載があるincludeの方法だとなぜかうまく動作しなかったので、そのあたりを少し変えてます。

require_once './vendor/autoload.php';

use PayPay\OpenPaymentAPI\Client;
use PayPay\OpenPaymentAPI\Models\CreateQrCodePayload;
use PayPay\OpenPaymentAPI\Models\OrderItem;

$client = new Client([
  'API_KEY' => 'YOUR_API_KEY',
  'API_SECRET'=>'YOUR_API_SECRET',
 'MERCHANT_ID'=>'YOUR_MERCHANT_ID' 
],false); //Set True for Production Environment. By Default this is set False for Sandbox Environment.

// setup payment object
$CQCPayload = new CreateQrCodePayload();

// Set merchant pay identifier
$CQCPayload->setMerchantPaymentId("YOUR_TRANSACTION_ID" . $_GET["rmnum"]);

// Log time of request
$CQCPayload->setRequestedAt();
// Indicate you want QR Code
$CQCPayload->setCodeType("ORDER_QR");

// Provide order details for invoicing
$OrderItems = [];
$OrderItems[] = (new OrderItem())
    ->setName('Cake')
    ->setQuantity(1)
    ->setUnitPrice(['amount' => 1, 'currency' => 'JPY']);
$CQCPayload->setOrderItems($OrderItems);

// Save Cart totals
$amount = [
    "amount" => 1,
    "currency" => "JPY"
];
$CQCPayload->setAmount($amount);
// Configure redirects
$CQCPayload->setRedirectType('WEB_LINK');
$CQCPayload->setRedirectUrl('YOUR_REDIRECT_URL');

// Get data for QR code
$response = $client->code->createQRCode($CQCPayload);

今年も残り少なくなってきましたが、これからさらに面白い記事が投稿されると思うのでお楽しみください!

adventar.org