スタンドアロン型オンランプを使用する公開プレビュー

リダイレクト URL を生成し、スタンドアロン型オンランプのセッションを発行します。

The Stripe-hosted, standalone onramp is a prebuilt frontend integration of the crypto onramp hosted at https://crypto.link.com. Platforms can integrate the crypto onramp by redirecting their users to the standalone onramp, rather than hosting an embedded version of the onramp within their application.

はじめに

テスト環境を含む Onramp API にアクセスするには、以下の手順に従って申し込みを提出する必要があります。ほとんどのオンランプ申請は 48 時間以内にレビューを行います。

Stripe アカウントを作成またはサインインして、オンランプ申し込みを送信します。
Stripe 申し込みを完了する。
申し込みを送信したら、テスト環境を使用して開発を開始します。

申し込みが承認されたとき、または追加の情報が必要な場合、Stripe からご連絡します。申し込みのステータスは、いつでもユーザー登録ページで確認できます。

ノーコードのスタンドアロン型オンランプ

スタンドアロンオンランプのリダイレクト URL は、パラメーターのカスタマイズをサポートし、宛先通貨、ソース金額または宛先金額などのフィールドに事前入力できます。

次のデモのように、リンクをユーザーに直接送信するか、ボタンで表示して、リンクを共有します。

この URL に直接ユーザーを送信する

https://crypto.link.comクリップボードにコピー

Livemode

リダイレクト URL があるボタン例

Buy Crypto

コードでリダイレクト URL を作成する

const standaloneOnramp = window.StripeOnramp.Standalone();
const redirectUrl = standaloneOnramp.getUrl();

return (
  <a href={redirectUrl}>
    Buy Crypto
  </a>
);

スタンドアロンのオンランプをカスタマイズする

Standalone 関数を使用してコードでリダイレクト URL を生成し、目的のフィールドを渡すこともできます。リダイレクト URL を生成するか、リダイレクト URL を使用してセッションを作成するかを選択します。

カスタマイズオプション	概要	最適なユーザー
リダイレクト URL を生成する	Stripe アカウントなしでフロントエンドでリダイレクト URL を生成します。ソースまたは宛先の推奨金額、宛先通貨、ネットワークをカスタマイズします。	ブランディングをせずに、部分的なカスタマイズでシンプルなフロントエンドのみの導入を希望する場合。
リダイレクト URL でセッションを発行する	Stripe アカウントのバックエンドでリダイレクト URL を使用してセッションをミントします。宛先のウォレットアドレスなど、完全なカスタマイズが可能です。パラメーターの一覧については、取引パラメーターの事前入力をご覧ください。	ブランディングによるオンランプの完全なカスタマイズを希望する場合。

リダイレクト URL を生成する

以下のスクリプトを、script タグを使用して HTML の <head> 要素内に含めます。互換性と PCI 準拠のため、このスクリプトは常に Stripe のドメイン (「https://js.stripe.com」、「https://crypto-js.stripe.com」) から直接読み込んでください。このスクリプトをバンドルに含めたり、そのコピーを自分でホストしたりしないでください。その場合、警告なしに実装が壊れる可能性があります。

<head>
  <title>Onramp</title>
  <script src="https://js.stripe.com/basil/stripe.js"></script>
  <script src="https://crypto-js.stripe.com/crypto-onramp-outer.js"></script>
</head>

Standalone 関数を使用して、リダイレクト URL を作成し、希望のパラメーターを渡します。

const standaloneOnramp = window.StripeOnramp.Standalone({
  source_currency: 'usd',
  amount: {source_amount: '42'},
  destination_networks: ['ethereum', 'bitcoin'],
  destination_currencies: ['eth', 'btc'],
  destination_currency: 'btc',
  destination_network: 'bitcoin'
});
const redirectUrl = standaloneOnramp.getUrl();

以下のパラメーターに事前入力できます。

source_currency: 取引の法定通貨 (usd、eur)。
amount: 法定通貨または仮想通貨によるこの購入の固定金額。法定通貨の金額を指定するには、source_amount ({source_amount: 42}) を渡します。仮想通貨の金額を指定するには、destination_amount ({destination_amount: 42}) を渡します。指定できる金額は 1 つのみです。
destination_currencies: 制限対象とする仮想通貨の配列 (['eth', 'usdc'])
destination_networks: 限定先にする仮想通貨ネットワークの配列 (['ethereum', 'polygon'])。
destination_network: このオンランプのデフォルト仮想通貨ネットワーク (ethereum)。
destination_currency: このオンランプセッションのデフォルト仮想通貨 (eth)

フロントエンドで仮想通貨オンランプが事前構築されたスタンドアロン型オンランプの URL に、ユーザーをリダイレクトします。

リダイレクト URL でセッションを発行する

他の実装と同様に、ユーザーがアクセスするたびに新規オンランプセッションを作成するサーバーエンドポイントを実装する必要があります。オンランプセッションの作成リクエストが redirect_url を返します。スタンドアロン型オンランプで全面的にブランド化したカスタムの仮想通貨オンランプの URL に、ユーザーをリダイレクトします。

次の curl コマンドを実行し、redirect_url を指定して仮想通貨オンランプセッションを生成します。

Command Line
curl -X POST https://api.stripe.com/v1/crypto/onramp_sessions \
  -usk_test_BQokikJOvBiI2HlWgH4olfQ2
:

次のようなレスポンスを受信します。

{
  "id": "cos_0MpKNb589O8KAxCGjmaOVF8T",
  "object": "crypto.onramp_session",
  "client_secret": "cos_0MpKNb589O8KAxCGjmaOVF8T_secret_fqV1TAdhSCFeO9FW5HnygRXca00AwEHIOu8",
  "created": 1679701843,
  "livemode": false,
  "redirect_url": "https://crypto.link.com?session_hash=CCwaGwoZYWNjdF8yOERUNTg5TzhLQXhDR2JMbXh5WijU7vigBjIGmyBbkqO4Oi10eFHEaFln9gFSsTGQBoQf5qRZK-A0NhiEIeH3QaCMrz-d4oYotirrAd_Bkz4",
  "status": "initialized",
  "transaction_details": {
    "destination_currency": null,
    "destination_amount": null,
    "destination_network": null,
    "fees": null,
    "lock_wallet_address": false,
    "source_currency": null,
    "source_amount": null,
    "destination_currencies": [
      "btc",
      "eth",
      "sol",
      "usdc",
      "xlm"
    ],
    "destination_networks": [
      "bitcoin",
      "ethereum",
      "solana",
      "polygon",
      "stellar"
    ],
    "transaction_id": null,
    "wallet_address": null,
    "wallet_addresses": null
  }
}

注