fincode for ESModules: JavaScript SDK library for fincode byGMO

fincode for ESModulesはJavaScript/TypeScriptプロジェクトにおけるfincodeJSの呼び出しを支援するラッパーライブラリです。 fincodeJSのロードを簡略化し、ヘルパー関数とTypeScriptの型定義を提供します。

このライブラリはクライアントサイドJavaScriptプロジェクトでの利用を想定しています。 Node.js環境下でfincodeを利用する場合はfincode for Node.JSを利用できます。

Getting Started

プロジェクトでnpmを使っている場合、npm経由でfincode for ESModulesをインストールできます。

``bash
$ npm i @fincode/js

yarnによるインストールの場合


$ yarn add @fincode/js
`

Usage

$3

テスト環境および本番環境の管理画面からAPIキーを取得します。

APIキーはパブリックキーである必要があります。

$3

Getting Startedの手順に従い、 @fincode/js をプロジェクトにインストールします。

$3

initFincode メソッドを呼び出し、 fincodeインスタンスを作成します。

`js
import { initFincode, getCardToken } from "@fincode/js"

const main = async () => {

const fincode = await initFincode({
publicKey: "p_*_*", // Public key
isLiveMode: true, // fincode Environment
})

// mount fincode payment UI form
const ui = fincode.ui({ layout: "vertical" })
ui.create("payment", { layout: "vertical" })
ui.mount("fincode", "400")

// get card token
const const onSubmit = async (e) => {
e.preventDefault()

const response = await getCardToken(fincode, ui, "4")
const tokens = response.list // expect 4 tokens

// Process something with token.
}
}
`

Utility Functions

fincode js SDKは本来のfincode JSのラッパーとしての機能に加え、さらに便利に利用できるユーティリティ関数を提供します。

$3


UIコンポーネントに入力されているカード情報をもとに決済実行JS（payments()）を呼び出します。
Promiseを返し、解決時には決済オブジェクト（PaymentObject）を返します。

`ts
import { executePayment } from "@fincode/js"

(async () => {
const payment = await executePayment({
fincode: fincode, // fincode instance (FincodeInstance)
ui: ui, // fincode UI instance (FincodeUI). : you can use the data input in the fincode ui component directly.

id: "", // order id of payment (string)
payType: "Card", // payment type (Card | Applepay | Konbini | Paypay | Directdebit | Virtualaccount)
accessId: "", // access id of payment (string)
})
})()

`

$3

UIコンポーネントに入力されているカード情報をもとにカードトークンを取得します。
Promiseを返し、解決時にはトークン情報を含むデータを返します。

`ts
import { getCardToken } from "@fincode/js"

(async () => {
const res = await getCardToken({
fincode: fincode, // fincode instance (FincodeInstance)
ui: ui, // fincode UI instance (FincodeUI). : you can use the data input in the fincode ui component directly.
number: "4" // how many tokens you want to get (string, default: "1")
})
const tokens = res.list // there are 4 tokens in this array.
})()
`

$3


UIコンポーネントに入力されているカード情報をもとにカードを登録します。
Promiseを返し、解決時には登録されたカードオブジェクト（CardObject）を返します。

`ts
import { registerCard } from "@fincode/js"

(async () => {
const card = await registerCard({
fincode: fincode, // fincode instance (FincodeInstance)
ui: ui, // fincode UI instance (FincodeUI). : you can use the data input in the fincode ui component directly.
customerId: "", // customer id to register the card (string)
useDefault: true, // use the card as default card (boolean)
})
})()
``