Subscribe to receive notifications of new posts:

Subscription confirmed. Thank you for subscribing!

Cloudflare Workersで、StripeのJavaScript SDKをネイティブサポート

Loading...

Cloudflare Workersで、StripeのJavaScript SDKをネイティブサポート

アプリの中で支払いを処理することは、オンラインビジネスを構築する上で非常に重要です。多くの開発者が決済のプラットフォームに選ぶのがStripeです。私が初めてStripeに出会ったのは約7年前ですが、このサービスは単純な支払い処理をはるかに超えて進化しています。昨年紹介したeコマースのサンプルアプリケーションでは、StripeはConnect製品を使って完全な販売者のマーケットプレイスを管理していました。単に支払いを受け取るだけでなく、それ以上のことをしたいと考えている開発者にとって、Stripeの製品スイートは素晴らしいものです。

StripeのSDKの初期バージョンは、多くの人気JavaScriptパッケージと同様に、コアとなるNode.jsに依存していました。Stripeの場合は、HTTPインタラクションを処理するために、`net/http`のようなNode.jsのコアライブラリと直接やりとりしていました。V8ベースのランタイムであるCloudflare Workersの場合、これは公式のStripe JSライブラリが動作しないことを意味し、Stripeの(ドキュメントが充実した)REST APIを使用するようにフォールバックする必要がありました。そうすると、StripeのネイティブJSライブラリを使用するメリットが失われてしまいます。例えば、エディタでの自動タイプチェックや、Stripeの様々な機能を操作するためのHTTPリクエストを手動で作成する代わりに、 stripe.customers.create()  のようなシンプルな関数呼び出しができるというメリットです。

4月には、Workersと互換性のあるJavaScriptパッケージの数をと書きました。

>ユーザーが人気のあるNode.jsライブラリをシームレスにインポートできるようになるまで、私たちは努力を止めません。この取り組みは大規模かつ継続的なものですが、その価値は十分にあると当社では考えています。

Cloudflare Workers用 stripe JSパッケージの一般提供を発表できて嬉しく思います。お客様のプロジェクトにネイティブのStripe SDKを直接使用いただけるようになります。まずは、プロジェクトに 'stripe' をインストールしてください( npm i stripe )。

また、Cloudflare Pagesにサイトをデプロイしている開発者の方は、アプリケーションと共にStripeを使い始めることができるようになりました。今週発表されたCloudflare Pagesでのサーバーレス関数サポートにより、Pagesプロジェクトに数行のJavaScriptを追加するだけで、デジタル製品の支払いを受け付けたり、会員制サイトの購読を処理することができます。追加の設置は必要なく、Pagesサイトと同様に自動的に拡張も行われます。

この機能を紹介するために、オープンソースのリポジトリに Stripe Checkout をPagesアプリケーションに統合する方法の例を用意しました。昨日お知らせした通り、Pagesの新しいWorkers Functions機能では、プロジェクトに新しい functions フォルダを追加するだけで、無限に拡張可能な関数を展開することができます。 この機能は、 stripe.pages.devでご覧いただけます。 また、 GitHubのオープンソースリポジトリもご覧ください。

このSDKをインストールすれば、アプリケーションで直接支払いを受け付けることができます。以下の例では、新しいCheckout(支払い)セッションを開始して、ホストされたStripe支払いペー[1] ジへリダイレクトする方法を示しています。

const Stripe = require("stripe");

const stripe = Stripe(STRIPE_API_KEY, {
  httpClient: Stripe.createFetchHttpClient()
});

export default {
  async fetch(request) {
    const session = await stripe.checkout.sessions.create({
      line_items: [{
        price_data: {
          currency: 'usd',
          product_data: {
            name: 'T-shirt',
          },
          unit_amount: 2000,
        },
        quantity: 1,
      }],
      payment_method_types: [
        'card',
      ],
      mode: 'payment',
      success_url: `${YOUR_DOMAIN}/success.html`,
      cancel_url: `${YOUR_DOMAIN}/cancel.html`,
    });

    return Response.redirect(session.url)
  }
}

Cloudflare WorkersではStripe SDKをネイティブにサポートしているため、決済処理だけでなく、様々な機能を利用することができます。Stripeの豊富なドキュメントに掲載されているJavaScriptのサンプルは、何の変更も必要なくWorkersで直接動作します。

特に、StripeのwebhookをWorkersで処理することで、新しいインフラを構築することなく、既存のプロジェクトがどのように機能しているかをよりよく把握することができます。以下の例では、Workers関数に送られてくるwebhookリクエストを安全に検証し、そのWebhook内のデータを解析してビジネスロジックを実行する方法を示しています。

const Stripe = require("stripe");

const stripe = Stripe(STRIPE_API_KEY, {
  httpClient: Stripe.createFetchHttpClient()
});

export default {
  async fetch(request) {
    const body = await request.text()
    const sig = request.headers.get('stripe-signature')
    const event = stripe.webhooks.constructEvent(body, sig, secret)

    // Handle the event
    switch (event.type) {
      case 'payment_intent.succeeded':
        const paymentIntent = event.data.object;
        // Then define and call a method to handle the successful payment intent.
        // handlePaymentIntentSucceeded(paymentIntent);
        break;
      case 'payment_method.attached':
        const paymentMethod = event.data.object;
        // Then define and call a method to handle the successful attachment of a PaymentMethod.
        // handlePaymentMethodAttached(paymentMethod);
        break;
      // ... handle other event types
      default:
        console.log(`Unhandled event type ${event.type}`);
    }

    // Return a response to acknowledge receipt of the event
    return new Response(JSON.stringify({ received: true }), {
      headers: { 'Content-type': 'application/json' }
    })
  }
}

当社はまた、Stripeとのパートナーシップにより、新しいWorkersのテンプレートを発表します。このテンプレートにより、StripeとWorkersを使って、ベスト・プラクティスを活用しながら、すぐに使い始めることができます。

5分以内に、次のデジタル製品や会員制ビジネスのための決済を開始することができます。また、単一のコードベースで、受信したWebhookをエッジで処理し、検証することができます。これには、初期費用やサーバーのプロビジョニングなど、スケーリングに関する標準的な問題は一切ありません。サーバーレス機能をCloudflareのエッジにデプロイして、お金儲けを始めましょう!

>StripeではCloudflare Workersの大ファンです。エッジでの強力なパフォーマンスと素晴らしいサーバーレス開発エクスペリエンスの中で、皆様がStripeを使ってどんな斬新な方法で素敵なアプリを作るのかか、見るのが楽しみです。
Stripe、Brian Holt氏

StripeのJavaScript SDKにこのような素晴らしいアップデートが加えられたことを、大変嬉しく思います。WorkersでStripeをネイティブにサポートすることで、皆様がどのようなアプリを作ってくれるのか期待しています。当社のDiscordサーバーに参加して、#what-i-built チャンネルで成果を共有してください。 — 招待リンクはこちらから

Cloudflareは 企業のネットワーク全体 を保護し、お客様が インターネット規模のアプリケーションを効率的に 構築するためのお手伝いをします。また、すべての Webサイトまたはインターネットアプリケーション を迅速化し、 DDoS攻撃を軽減して、 ハッカーを封じ込めます 。さらに、 Zero Trustを始める、あるいは導入のあらゆるフェーズにいる お客様を支援します。

インターネットを高速化し、安全性を高めるには、ご使用のデバイスから 1.1.1.1 にアクセスすることで、Cloudflareの無料アプリをご利用いただけます。

より良いインターネットの構築を支援するというCloudflareの使命について詳しくは、 こちら をご覧ください。新たなキャリア形成をお考えの方は、 求人情報 にアクセスしてください。

製品ニュース (JP) 開発者 (JP) フルスタックウィーク 日本語

Follow on Twitter

Kristian Freeman |@signalnerve
Cloudflare |Cloudflare

Related Posts

June 20, 2022 1:57PM

メールリンクのブラウザ分離で最新のフィッシング攻撃を阻止

Area 1を当社の幅広いZero Trustスイートに統合するエキサイティングな行程の一環として、Cloudflare Gatewayをご利用のお客様はまもなくメールリンクのリモートブラウザ分離を有効化できます。Email Link Isolationで、メールベースの巧妙なマルチチャネル攻撃に対する比類ないレベルの防御を実現しましょう...

March 13, 2018 1:00PM

Workersを使って誰もがCloudflare上でJavaScriptを実行できるようになりました

私たちは、クラウドコンピューティングの真の夢は、お客様のコードがネットワーク自体の中に存在することだと考えています。お客様のコードは、「アメリカ西部4州」や「南中央アジア (ムンバイ)」などで実行されるものではなく、あらゆる場所で実行されるのです...

June 21, 2022 1:55PM

Cloudforce Oneの紹介:新しい脅威オペレーション・調査チーム

新しい脅威オペレーション・調査チームをご紹介:Cloudforce One。このチームにとって調査結果の発表は役割の1つですが、そのためだけに存在するのではありません。このチームの主な目的は脅威アクターを追跡し、その動きを封じ込めることにあります...