公式Webサイト
お問い合わせ
ブログ
パワフルな
ブログ一覧
firebase
JavaScript
next.js
PHP
React
Stripe
TypeScript
WordPress
Stripeで決済画面を作成【Express,Next.js,TypeScript】
stripeを用いて決済画面を作成する場面がありましたので、備忘録としてまとめます。 後から「時間があれば」画像等を追加して、細かい説明を作成したいと、思っています😅 フロント側も「別途時間ができた際」に掲載しようとは思いますが、基本的には各種必要なものをbodyにセットして、今回作成するエンドポイントにリクエストを送るだけになります（雑） stripeアカウント作成 下記リンクからアカウントを作成します。 stripeアカウント作成 登録完了後、環境を「テスト環境」に変更し、「商品カタログ」より商品を追加します。 各種モジュールをインストール npm install stripe Stripeオブジェクトと、秘密キーを用意 stripeオブジェクトの定義と、秘密キーを用意し、定義しておきます。 const Stripe = require("stripe"); const stripe = Stripe("秘密キーを記載"); 商品リストを取得 stripeの商品一覧は、priceIDというものに紐づいており、stripe.pricesで取得することができます。 また、stripeでは一度公開した商品を削除するのは基本的には無く、アーカイブという形をとります。 なので、該当の商品がアクティブ状態であるというのをフィルタリング（.product.active）する形をとります。 app.get("/prices", async (req, res) => { try { const prices = await stripe.prices.list({ expand: ["data.product"], }); // アーカイブされていない価格のみをフィルタリング const activePrices = prices.data.filter((price) => price.product.active); res.json(activePrices); } catch (error) { res.status(500).json({ […]
