JPYC エレメント

 

📌 JPYCエレメントとは

Clickアプリに JPYC(日本円ステーブルコイン)の送金 / 決済機能 を追加できるエレメントです。
サポートしているウォレット(2025年11月27日時点)
  • MetaMask(他のウォレットに関しては順次サポートを行う予定です)
サポートしているチェーン
  • Ethereum
  • Polygon
  • Avalanche

📌 エレメントの追加

  1. 左側の「エレメント」パネルを開く
  1. JPYC決済エレメント を選択
  1. キャンバスへドラッグ & ドロップ
 

📌 JPYC送金フォームの表示

エレメントを配置すると、自動で次の UI が表示されます:

📌 送金設定(受取アドレス・金額)

送金設定を行います。誰に対して、いくら送金するかの設定を行います。
 

① 受取アドレス

  • 直接アドレスを入力するか、DBからの値を変数として指定します。

② 金額(JPYC)

  • 直接金額を入力するか、DBからの値を変数として指定します。
 

📌 5. 決済後アクションの設定

決済後のアクションを設定することができます。例えば、サービスの購入に使う場合、取引ID以外に商品名などの追加情報を入れてClickのDBに保存することが可能です。
購入後にサンクスページ等に遷移させることもできます。
 
成功時アクション(推奨)
  • DB に購入履歴を追加
  • ページ遷移(サンクスページへ)
失敗時アクション
  • ページ遷移(購入失敗ページへ)

📌 6. プレビューでの決済フロー

設定が完了したらプレビューし、以下の流れでテストできます。

① ウォレット接続(MetaMask)

アプリ起動 → MetaMask が接続要求を表示
ユーザーは「接続」を押すだけ。

② ネットワーク選択

ユーザーが Ethereum / Polygon / Avalanche を選択
ウォレット側もネットワーク確認画面が表示。
 

③ JPYC決済ボタンを押す

決済ボタンを押すと、設定した金額でウォレットへ送金リクエストが送られます。
 
 

④ ウォレットで送金許可

MetaMask で送金内容を確認し「確認」を押します。
  • 送金額(例:1 JPYC)
  • 送金元 / 送金先
  • ネットワーク
  • ガス代
上記の内容を確認して、正しければ確認ボタンを押して決済リクエストを許可して下さい。
 

⑤ 送金中 → 完了

ブロックチェーンに書き込まれるまで待機します。送金が完了すると支払完了と表示されます。
 

📌 7. トランザクション確認(PolygonScan等)

完了画面の トランザクションハッシュ を開くと、
PolygonScan などで実際の送金結果を確認できます。
 
この手順で、Clickアプリに JPYC決済機能が実装可能 です。
 

購入履歴をClick上でも保持したい

決済はブロックチェーン上で行われるため、履歴はPolygonScan等で確認できますが、別途商品名などの追加情報を後から確認したい場合、Click上で購入履歴を別途用意することが可能です。
 

①データベースを用意

「決済履歴」テーブルを作成して、
トランザクションID
ネットワーク
購入者
商品
金額
など必要な項目を追加して下さい
 

②アクションを用意

決済完了時に、「決済履歴」にデータを追加するロジックを入れます。
作成 → 決済履歴
を選択して下さい
 
 
先ほど作成したデータベースの項目に対してマッピングを行います。
JPYCエレメントでは、変数を追加 → JPYC決済1 から以下の3つの情報を取得できます。
Transaction Hash → 取引ID
Network → ネットワーク
SenderAddress → 購入者
その他の項目は直接入力するか変数を選択して下さい。
 
 

③決済の確認

実際にプレビューを行なって決済を確認して下さい。
決済が完了するとブロックチェーンだけではなく、ClickのDBにも購入履歴が作成されます。購入履歴の一元管理を行いたい場合や商品名など追加情報を保持したい場合におすすめです。