StripeのテストAPIキーの取得と実装
Silicon Valley Super Ware
2020年9月3日
StripeのテストAPIキーの取得と実装
Stripeha開発者にテスト用のAPIキーを発行してくれます。 従って、開発やテスト用に別のアカウントを作る必要はありません。テストモードでも、いろいろなデータを収集する事もできます。 開発する時に必要な事が網羅されている所はとても便利です。 自分のアカウントにログインしてダッシュボードに行くと 「テストデータ」と「本物のデータ」を切り替える事が出来るようになっています
決済に関連したイベントや、ログ情報を表示させることも可能です
また、最初はWebサービスにオンライン決済を組み込んでいなくても、 個別に請求書をWebサイトから発行して支払いをしてもらう事も可能です。オンラインでビジネスをする場合はとても便利なサービスです。
テスト用のAPIキーの取得
テスト用にAPIキーは、Stripeのサイトにログインしてダッシュボードで 表示を「テストモード」に切り替えます。そのあとで、「Developers -> API keys」に言ってキーを取得するだけです。
このテスト用のAPIキーを使うと、実際のお金の移動は起こりませんし、 Stripeの手数料も発生しません。
オンライン決済を実装後、十分なテストをしたうえで本物のAPIキーと入れ替えて 導入が可能なので安心して利用できます。
何度も書いていますが- 公開鍵（Publishable key）がフロントエンド用
- 秘密鍵（Secret key）がバックエンド用
APIキーの組み込み方
APIキーは開発・テスト時と、導入時では異なるキーを使います。 従ってAPIキーを入れ替えやすい方法でコードに導入すると変更がスムーズにできます。使いやすいのが「環境変数」を利用する方法です。 VueやReactの場合はプロジェクトのトップホルダーに「.env」というファイルを作って記述します
VUE_APP_PUBLIC_KEY=ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890
のように記述すればOKです。
const = process.env.VUE_APP_PUBLIC_KEY;
のように呼び出せばソースコードから参照できます。
このような構成にする事で、ソースコード自体を変更しなくてもAPIキーを入れ替える事ができます。
Vue.jsやReactのプロジェクトの場合、環境変数を使えるように設定されているので そのままファイルを作って呼び出せば仕様できます。バックエンドで利用する場合は、バックエンドのパッケージの最上位のフォルダーで 同じように「.env」ファイルを作れば良いのですが、通常は環境変数を扱うモジュールが 導入されていないので「npm」を使って、「dotenv」のパッケージをインストールします。
require('dotenv').config('.env');
という記述を入れておけばフロントエンドと同じように環境変数を呼び出すことができます。
来週はバックエンドを作ります！
前回紹介したStripeのサンプルのコードにバックエンドの例も含まれています。SendGridのサービスを扱った時と同じように「Express」を導入すれば 簡単に実装できます。
最初に実装するバックエンドのサービスは、バックエンドで固定された 商品のコードと価格をStripeのサーバーに送ってセッションを作成して その情報をフロントエンドに返すというものです。
SendGridでメッセージを送るより簡単な処理です。 詳しくは次回お届けします！
シリコンバレースーパーウエアでは、単に機能を作るだけではなく、ビジネスを意識した サービス作りの手法を提供しています。 単純に、Webサービスを作るだけではなく、どのように作って、どのようにビジネスにつなげて 行くかが鍵です。また、フリーランスの方だけではなく、就職を考えている方にも 「実践力」を養うことで「即戦力」のエンジニアとしてのスキルを身に着ける事ができます！
興味のある方は今すぐお問合せください！
またよろしければ、ニュースレターの登録をお願いします！大体週一回お届けしています。ブログよりは一歩踏み込んだもっと濃い内容を発信しています。
コメント
コメントを投稿