acomagu/cred.ts

## cred.ts
import * as toml from 'https://deno.land/std@0.207.0/toml/mod.ts';

async function getStripeConfig() {
  const { stdout } = await new Deno.Command('stripe', {
    args: ['config', '--list'],
    stderr: 'inherit',
  }).output();

  return toml.parse(new TextDecoder().decode(stdout)) as any;
}

export async function getTestModeApiKey() {
  return (await getStripeConfig()).default.test_mode_api_key;
}

export async function getTestModePubKey() {
  return (await getStripeConfig()).default.test_mode_pub_key;
}

## try-stripe-embedded-checkout.tsx
/** @jsx jsx */
import { Stripe } from 'npm:stripe';
import { Hono } from 'https://deno.land/x/hono@v3.10.4/mod.ts'
import { jsx } from 'https://deno.land/x/hono@v3.10.4/middleware.ts'
import { html } from 'https://deno.land/x/hono@v3.10.4/helper/html/index.ts';
import { getTestModeApiKey, getTestModePubKey } from 'https://gist.githubusercontent.com/acomagu/2a55aca48a45c17f36a71fceec6b87a1/raw/cred.ts';

const stripe = new Stripe(await getTestModeApiKey(), { apiVersion: '2023-10-16' });

const app = new Hono();
app.get('/', async (c) => {
  const checkoutSession = await stripe.checkout.sessions.create({
    mode: 'payment',
    line_items: [{
      price_data: {
        currency: 'JPY',
        unit_amount: 100,
        product_data: {
          name: 'テスト',
        },
      },
      quantity: 1,
    }],
    ui_mode: 'embedded',
    redirect_on_completion: 'if_required',
    return_url: 'http://localhost:8000',
  });

  return c.html(<html>
    <script src="https://js.stripe.com/v3/"></script>
    {html`
      <script type="module">
        const checkout = await Stripe('${await getTestModePubKey()}').initEmbeddedCheckout({
          clientSecret: '${checkoutSession.client_secret}',
          onComplete: () => alert('Success'),
        });
        checkout.mount('#checkout');
      </script>
    `}
    ↓↓↓IFRAME↓↓↓
    <div id="checkout"></div>
    ↑↑↑IFRAME↑↑↑
  </html>);
});

console.log('Please run `stripe login` command beforehand.');

Deno.serve(app.fetch);
	import * as toml from 'https://deno.land/std@0.207.0/toml/mod.ts';

	async function getStripeConfig() {
	const { stdout } = await new Deno.Command('stripe', {
	args: ['config', '--list'],
	stderr: 'inherit',
	}).output();

	return toml.parse(new TextDecoder().decode(stdout)) as any;
	}

	export async function getTestModeApiKey() {
	return (await getStripeConfig()).default.test_mode_api_key;
	}

	export async function getTestModePubKey() {
	return (await getStripeConfig()).default.test_mode_pub_key;
	}
	/** @jsx jsx */
	import { Stripe } from 'npm:stripe';
	import { Hono } from 'https://deno.land/x/hono@v3.10.4/mod.ts'
	import { jsx } from 'https://deno.land/x/hono@v3.10.4/middleware.ts'
	import { html } from 'https://deno.land/x/hono@v3.10.4/helper/html/index.ts';
	import { getTestModeApiKey, getTestModePubKey } from 'https://gist.githubusercontent.com/acomagu/2a55aca48a45c17f36a71fceec6b87a1/raw/cred.ts';

	const stripe = new Stripe(await getTestModeApiKey(), { apiVersion: '2023-10-16' });

	const app = new Hono();
	app.get('/', async (c) => {
	const checkoutSession = await stripe.checkout.sessions.create({
	mode: 'payment',
	line_items: [{
	price_data: {
	currency: 'JPY',
	unit_amount: 100,
	product_data: {
	name: 'テスト',
	},
	},
	quantity: 1,
	}],
	ui_mode: 'embedded',
	redirect_on_completion: 'if_required',
	return_url: 'http://localhost:8000',
	});

	return c.html(<html>
	<script src="https://js.stripe.com/v3/"></script>
	{html`
	<script type="module">
	const checkout = await Stripe('${await getTestModePubKey()}').initEmbeddedCheckout({
	clientSecret: '${checkoutSession.client_secret}',
	onComplete: () => alert('Success'),
	});
	checkout.mount('#checkout');
	</script>
	`}
	↓↓↓IFRAME↓↓↓
	<div id="checkout"></div>
	↑↑↑IFRAME↑↑↑
	</html>);
	});

	console.log('Please run `stripe login` command beforehand.');

	Deno.serve(app.fetch);