独自開発のサイトに決済機能を入れたいという要望はたくさんあります。一昔前だと、カード決済代行会社と契約をして、審査のために書類やら何やらいろいろと準備して、厳しい制約を受けながら、手数料もたくさん取られてしまう、という状態でしたが、時代は変わり、比較的簡単に導入できて手数料も明朗会計というサービスが出てきました。いうサービスを使って実現する方法を紹介します。複数サービスの比較は、他の人がたくさん行なっているので割愛します。導入は遅くとも数時間でできるレベルですので、「このサービス私のサイトには合わない」と思った後で他に乗り換えても、それほど手戻り工数は大きくありません。決済手数料は、取引の3.6%です。使って決済を行うためには以下のものが必要です。事前に準備しておきましょう。https://stripe.com/jpを表示します「アカウント登録」をクリックします。アカウントを作成」をクリックします。はい、ダッシュボードが表示されました。アカウント作成1分ぐらいで完了です。address」をクリックして認証を行なってください。メールアドレス認証を行わないと本番課金ができません。(テスト課金は可能です)本番環境利用の申請メールアドレス認証を行なったら、本番環境利用の申請を行なっていきます。ダッシュボードサイト左メニューの「本番環境利用の申請」をクリックし、右側に表示された項目を入力していきます。基本的に質問に答えていけば問題ありませんが、サポートの電話番号や銀行口座など事前に準備しておかなければならないこともありますので、法人の場合は担当者に聞いておきましょう。すべて入力し終わったら一番下にある「アカウントを有効にする」をクリックしてアカウントを有効にします。アカウントが有効になり、本番環境での決済ができる状態になりました。サイトがHTTPSであること、特定商取引法に基づく表記があること、が条件ですのでサイトがそのようになっていることを確認しましょう。APIキーが必要になります。ダッシュボードサイトでテスト用のAPIキーと本番用のAPIキーを表示させて取得しておきます。ダッシュボードサイト左メニューの「開発者」「APIキー」の順にクリックします。シークレットキー欄の「テスト用キーを表示」をクリックします。公開可能とシークレットキーの「TOKEN」をメモしてください。次に、ダッシュボードサイト左メニューの「テストデータを表示」スイッチをクリックしてオフにし、本番用のデータを表示します。シークレットキー欄の「本番環境のキーを表示」をクリックします。公開可能とシークレットキーの「TOKEN」をメモしてください。アカウント側の設定は完了です。側の組み込みを進めていきます。組み込みではプラグインを使っていきます。Payments」というプラグインを使って組み込もうと思います。payments」を入力します。Payments」の「今すぐインストール」をクリックしてインストールします。インストールされたら「有効化」をクリックして有効にします。Payments」日本語化ファイルを使って日本語化したページで説明します。基本設定ダッシュボード左メニューの「Stripe支払い」「設定」をクリックします。画面の上部の「一般設定」タブを選択します。ボタン文字を入力します。下の方にある、APIキー4つを入力します。Stripeのダッシュボード画面で取得しておいた、テスト用公開キー・秘密キー、本番用公開キー・秘密キーの4つです。入力が終わったら「変更を保存」をクリックします。メール設定メール関係の設定は上部タブの「メール設定」をクリックします。購入者にメールを送るのか、販売者にメールを送るのか、タイトルや本文をカスタマイズするのか、この辺りは運用次第ということになりますので、自身の運用にあった設定をおこなてください。上部の「詳細設定」タブをクリックします。Decimals」です。(プラグインの不具合でこの文字の日本語化ができません)小数点以下の桁数を指定する場所なのですが、日本円では商品の値段に小数点は使いません。0にするとエラーになってしまうので-1を指定します。「変更を保存」をクリックします。設定が終わったので、商品を追加してみます。Stripe支払いの「商品」をクリックし、「新規商品を追加」をクリックします。ダウンロードURL等を入力し、商品を「公開」します。以上で商品がサイトに公開されます。商品一覧はデフォルト設定だとhttps://ドメイン名/products/というURLで見ることができます。購入テスト商品の作成が終わったら、商品一覧のページか管理画面のリンクから商品ページにアクセスします。タイトル、説明、購入ボタンが表示されていますので、「購入する」ボタンをクリックします。購入ボタンを押すと、クレジットカード情報を入力するポップアップが出てきます。テスト環境の場合は右上に「TEST」と表示されます。メールアドレス、カード番号、有効期限、セキュリティコード、を入力し「¥108を支払う」ボタンをクリックすると購入完了画面に遷移します。UnionPay支払い結果画面が表示され、商品のダウンロードリンクから商品がダウンロードできればテスト成功です。本番環境へスイッチ購入テストが終わったら本番環境へ移行し、実際に課金が発生するようにします。Stripe支払いの設定で、「一般設定」タブをクリックし、その中の「本番環境」のチェックボックスにチェックをつけます。本番環境のAPIキー(pk_liveとsk_liveで始まる文字列)もセットされていることを確認して、「変更を保存」をクリックします。以上で本番環境へスイッチします。先ほど試した商品画面で購入を試してみましょう。本物のクレジットカードで試して正常に動けば設置は完了です。その他の手続きここまでで、実際の商品販売はできるようになっています。実際に商品が売れると、Stripeから売上金振込のための本人確認手続きのお知らせなどが届くので、指示に従って本人確認をすませましょう。現時点(2018年11月20日)では英語の設定になっています。このチュートリアルを書くに当たって、自分で翻訳を行なってみました。販売するものがなかったのでその翻訳ファイルを販売してみることにしました。こちらから108円(税込)で購入できますので、よろしかったらご購入ください。実際に購入していただくと、課金のフローや届くメール等もご確認いただけると思います。三度の飯よりプログラミングが好きなフリーランスのITエンジニアです。開発を行なってきました。ご相談やお仕事の依頼など気軽にお問い合わせください。