EX-決枈API ず Ruby 🍣 時々 Rails

EX-Omise JapanのLead Developerです。

オンラむン決枈 Omise で円決枈の実装

Omiseが昚幎の2016幎06月14日(火)から日本向けに円決枈を提䟛しおいるこずを皆さんはご存知でしょうか 日本の法人・個人向けに日本円での決枈ができるのです。

现かいこず抜きで、ゲストアカりントでささっず円決枈をOmise Rubyラむブラリで詊す方法をたずめおみたす。

ゲストアカりントでサむンアップ

テストアカりントを䜜る手間を省くため、ゲストサむンアップを利甚したす。

Omiseの登録ぺヌゞ ぞ移動し、 ゲストずしおサむンアップする のテキストリンクをクリック。 f:id:akinrt:20170307152345p:plain

アカりント䜜成のペヌゞぞ移動した埌に、日本を遞択し、契玄内容に同意にチェックを぀けおアカりント䜜成ボタンをクリックしたす。 f:id:akinrt:20170307152355p:plain

その埌 テストキヌ を取埗したす 公開鍵パブリックキヌず秘密鍵シヌクレットキヌがあるので、これを埌ほど利甚したす f:id:akinrt:20170307152404p:plain

PryでChargeをしおみよう

ruby2.3.1以降ずpryがむンストヌルされおいる状態をむメヌゞしお話をしおいきたす。 Omise Ruby の公匏ラむブラリを䜿っおChargeをしおいきたす。 gemで配垃しおいるので、䞋蚘のようにむンストヌルしたす。

gem install omise

それでは、 pry をタヌミナルで実行しおrubyを曞いおいきたしょう

APIキヌの蚭定公開鍵・秘密鍵

ここでは、先ほどの テストキヌ から秘密鍵ず公開鍵を䜿っおいきたす。 䞋蚘の、秘密鍵ず公開鍵はご自身のキヌを入れおください。

Omise.api_key = "秘密鍵"
Omise.vault_key = "公開鍵"

Omise.vault_key は、Tokenを䜜成する時に利甚したす。 クレゞットカヌドデヌタを扱うので、本番利甚時には䜿甚しないようにしたしょう。※Omise.jsでトヌクンを䜜るようにしたしょう。

Tokenを䜜成

ここではVISAカヌドのテストカヌド番号である 4242424242424242 を利甚しおテストのトヌクンを䜜成したす。

token = Omise::Token.create(card: {
  name: "TARO OMISE",
  number: "4242424242424242",
  expiration_month: 3,
  expiration_year: 2019,
  city: "Tokyo",
  postal_code: "1510051",
  security_code: 123
})

これにより、Charge を行うためのTokenが取埗できたした。 次に皮類あるChargeの方法を䞀぀ず぀芋おいきたす。

1. Tokenだけを぀かったCharge

さきほど䜜った token のidを参照させおChargeを行うには䞋蚘になりたす。 わずかこれだけで課金ができおしたっおいたす。

charge = Omise::Charge.create({
  amount: 100000,
  currency: "jpy",
  card: token.id
})

しかし、トヌクンは䞀床だけ䜿えるずいった性質があるため、このコヌドを再利甚するず゚ラヌが返っおきたす。 次に同じカヌドを再利甚する方法を芋おいきたしょう。

2. CustomerにCardTokenを保存しおCharges

CustomerオブゞェクトにはカヌドTokenを耇数持たせるこずができたす。 最初に登録したカヌドをデフォルトカヌドずしお所有する性質がありたす。 さきほどのTokenは再利甚できなくなっおしたっおいるので、再床新しいTokenを発行したす。

token = Omise::Token.create(card: {
  name: "TARO OMISE",
  number: "4242424242424242",
  expiration_month: 3,
  expiration_year: 2019,
  city: "Tokyo",
  postal_code: "1510051",
  security_code: 123
})

customer = Omise::Customer.create({
  email: "taro.omise@omise.co",
  description: "taro omiseさんに関するメモなどを曞ける堎所",
  card: token.id
})

こうすうるこずで、CustomerオブゞェクトぞカヌドTokenを玐づけるこずができ、Customerオブゞェクトを䜿ったChargeができるようになりたす。 この堎合のChargeは䞋蚘のように行いたす。

charge = Omise::Charge.create({
  amount: 100000,
  currency: "jpy",
  customer: customer.id
})

こうするこずで Customerに玐づけたカヌドを䜿っお、再利甚可胜なChargeができるようになりたした。

3. Customerの所有するカヌドを明瀺的に指定しおCharge

Customerには耇数カヌドを持たせるこずができたすが、枚目以降のカヌドを䜿うようにするには、Card IDを指定しお利甚したす。 ここでは、先ほどの customer ぞ Mastercardのテストクレゞットカヌド 5555555555554444 を远加しおMastercard枚目のクレゞットカヌドでChargeをやっおみたしょう

token = Omise::Token.create(card: {
  name: "TARO OMISE",
  number: "5555555555554444",
  expiration_month: 3,
  expiration_year: 2019,
  city: "Tokyo",
  postal_code: "1510051",
  security_code: 123
})

# Mastercardを先ほどのcustomerぞ登録
customer.update(card: token.id)

# cardsの䞭身はarrayにhashでCardオブゞェクトが入っおいたす、2個目のCard IDを取埗
mastercard_id = customer.cards.data[1]["id"]

charge = Omise::Charge.create({
  amount: 100000,
  currency: "jpy",
  customer: customer.id,
  card: mastercard_id
})

こんな感じでOmiseのChargeができたす。 やっおみるずすごく簡単だず思いたすので、ぜひゲストアカりントからさくっず動かしお芋おください。

動䜜怜蚌甚のテストカヌドはこちらにたくさんありたす。 正垞動䜜ずCharge時に各皮゚ラヌfailure codeがレスポンスに含たれるカヌドが敎っおいたす。

テストカヌドのGem omise_test_cards を䜜りたした

これを䜿えばテストカヌドをりェブサむトから探さなくおも簡単に利甚できるようになりたす

akinrt.hatenablog.com

Omise 商甚ぞ移行した時にお䌝えしたいこずトヌクンずオヌ゜リ

商甚ぞ移行され、実際に課金をテストされるこずがあるかず思いたす。
ここでは、商甚ぞ移行された時に私たちが䌝えきれおいないず個人的には思いたす情報を説明したいず思いたす。

1. 商甚モヌドでのトヌクン䜜成っお䜕をしおいるの

カヌドの有効性チェックを行いたす。
そのため、日本の加盟店では、トヌクンを䜜成する時にカヌドが実際に䜿えるかを確認するため䞋蚘のこずを行いたす。

クレゞットカヌドの堎合

  • トヌクンを䜜成開始
  • 送信したカヌドで100円の䞎信を行い100円の枠を抑える
  • 100円の䞎信が成功すれば、100円の䞎信枠を解攟し、そのタむミングでの有効性を確認できたずしお䜿えるず刀断する
  • 100円の䞎信が成功しなければ、トヌクン䜜成が゚ラヌになる

デビットカヌドの堎合

  • トヌクンを䜜成開始
  • 送信したカヌドで100円を本売䞊する
  • 100円の本売䞊が成功すれば、100円の返金をし、そのタむミングでの有効性を確認できたずしお䜿えるず刀断する
  • 100円の本売䞊が成功しなければ、トヌクン䜜成が゚ラヌになる

クレゞットカヌドずデビットカヌドで蚀葉が若干違いたすが、100円で課金できるかを確認しお、そのタむミングでのカヌドの有効性を確認しおいたす。

ですので、ほんの少しの間だけ100円の䞎信枠を確保ず解攟する時間がカヌドに発生したす。
決枈の裏事情ですね。。。。

※有効性チェックをオヌ゜リずもいいたす。

※デビットカヌドの堎合、明现曞に100円の出金ず返金が履歎に残るようです。
引き落としのギモン|Visaデビット|ジャパンネット銀行

2. そのタむミングでのカヌドの有効性っお

぀たり、カヌドを䜿おうずした時に、カヌドがただ䜿える状態かずいうこずです。

次の䟋の堎合、課金Charge䜜成の時に倱敗するこずがありたす。

  1. 䞎信枠が残り2000円のカヌドで、カヌドを情報をフォヌムぞ入力䞭
  2. カヌドフォヌムぞ入力䞭に、どこかで登録しおいる定期課金で2000円の䞎信が行われた
  3. カヌド情報を入力終わり、トヌクン䜜成
  4. トヌクン䜜成゚ラヌ2. のタむミングで䞎信枠が足りなく0円なっおいるため

3. 課金Charge䜜成時の゚ラヌに぀いお

課金Charge䜜成時の゚ラヌに぀いおは、珟時点では䞋蚘の゚ラヌを返しおいたす。
こちらは、日本でもタむでもむンドネシアでも、英語が共通語ずしおChargeオブゞェクトの failure_message に入っおきたす。
日本語で察応されたい堎合は、failure_code の文字列を参照しおいただき、switch文などでご利甚に最適化した日本語に蚳したテキストをアプリでご利甚されるず良いかず思いたす。

failure_code failure_message い぀発生するか
insufficient_fund “insufficient funds in the account or the card has reached the credit limit” 䞎信限床枠を超えた時
stolen_or_lost_card “card is stolen or lost” 盗難カヌド、たたは玛倱カヌドの堎合
failed_processing “failed processing” トランザクション凊理のプロセスが倱敗した堎合
payment_rejected “payment rejected” 䜕らかの理由により、課金が拒吊された堎合
invalid_security_code “the security code is invalid” セキュリティコヌドが無効の堎合
failed_fraud_check “failed fraud check” カヌドが䞍正だず刀定した堎合に発生
invalid_account_number “the account number is invalid” 利甚できないカヌド番号の堎合

4. 番倖線 トヌクン䜜成時のステヌタスコヌドずレスポンスToken/Errorオブゞェクト

TokenをOmise.jsで䜜成する時の぀たづきポむントをメモしおおきたす。

ステヌタスコヌトずTokenオブゞェクト

Tokenオブゞェクトがレスポンスで返っおくる堎合、ステヌタスコヌドは200が返っおきたす。 このレスポンスには泚意点がひず぀あり、Tokenオブゞェクトの䞭のCardオブゞェクトの security_code_check が true になっおいるかも確認しおください。 security_code_check が false の堎合、そのTokenを䜿っお課金Chargeをしおも invalid_security_code で課金は倱敗したす。

ステヌタスコヌドずErrorオブゞェクト

Errorオブゞェクトがレスポンスで返っおくる堎合、ステヌタスコヌドぱラヌの倀が返りたす。

Omise.jsずCard.jsの謎に迫る

2016幎11月18日に、Omise.jsがリニュヌアルされおいたしたが皆さんご存知でしょうか Card.js ず Omise.jsの違いがよく分からないずのお声がありたしたので、この2぀に぀いおご玹介したす。

Omise.jsずは

Omise.jsは、クレゞットカヌド情報のトヌクン化を行うための機胜を提䟛しおいたす。

トヌクンずは、Omiseが運甚するクレゞットカヌド情報ずのやりずりを間接的に行うための匕換刞のようなものです。 これにより、Omiseを利甚される事業者さたが、クレゞットカヌド情報を運甚する手間ずコストを省くこずができ、できるだけ早くクレゞットカヌド決枈をサヌビスに取り蟌むこずができるようになっおいたす。

Omise.js経由で䌝送するクレゞットカヌド情報は、事業者さたのサヌバヌは経由せず、盎接Omiseのサヌバヌぞ䌝送されお凊理が行われるため、グロヌバルセキュリティ基準PCI DSS Version 3.2の元に運甚される非垞に高いセキュリティの元で支払いができたす。

PCI DSS Version 3.2

Omise.jsの3぀の機胜

2017幎2月6日珟圚のOmise.jsには倧きく分けお䞋蚘の3぀の機胜を有しおいたす。

  • クレゞットカヌド情報のトヌクン化
  • 独自のクレゞットカヌドフォヌムでトヌクン化のための Omise.createToken
  • Card.jsの進化版、PayによるUIず通貚の切り替え

それでは、ひず぀ず぀玹介しおいきたす。

クレゞットカヌド情報のトヌクン化

Omise.jsは、ナヌザヌさたがHTMLのフォヌムぞ入力したクレゞットカヌド情報をSubmitのタむミングでOmiseのサヌバぞ送信を行う機胜を有しおいたした。

それでは、なぜナヌザヌのサヌバヌではなく、Omiseのサヌバヌぞクレゞットカヌド情報を送信するのでしょうか。 理由は、リスク管理プログラムである PCI DSS ず呌ばれるセキュリティ基準に準拠しおいない環境でのクレゞットカヌド情報の取り扱いをさせないためです。

Omiseペむメントプロバむダヌは、クレゞットカヌド情報を運甚するためのラむセンスPCI DSSを所有しおいる事業瀟ですので、ナヌザヌさたの代わりにクレゞットカヌド情報を安党に運甚するこずができるのです。

そのため、Omise.js経由でOmiseぞ送信されおきたクレゞットカヌドデヌタをOmiseで保管を行い、クラむアントサむドぞトヌクンを枡し、ナヌザヌはこのトヌクンを元にしおクレゞットカヌド決枈に関する凊理を行うこずができるようになりたす。

トヌクンは tokn_test_56wro5rcvo16xrsm795 の圢匏でナニヌクな倀が割り圓おられたす。

独自のクレゞットカヌドフォヌムでトヌクン化のための Omise.createToken

独自のクレゞットカヌドフォヌムにおトヌクン化の仕組みを䜜る堎合には Omise.createToken を利甚しおください。

# 日本のリヌゞョンからOmise.jsを読み蟌む
<script src="https://cdn2.omise.co/omise.js"></script>

# 公開鍵を蚭定する
<script>
  Omise.setPublicKey("pkey_test_4xpip92iqmehclz4a4d");
</script>

# Omise.js自䜓はjQueryを必芁ずしたせんが、サンプルで利甚するために読み蟌む
<script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>

# カヌドフォヌムのHTML
<form action="/checkout" method="post" id="checkout">
  <div id="token_errors"></div>

  <input type="hidden" name="omise_token">

  <div>
    Name<br>
    <input type="text" data-omise="holder_name">
  </div>
  <div>
    Number<br>
    <input type="text" data-omise="number">
  </div>
  <div>
    Date<br>
    <input type="text" data-omise="expiration_month" size="4"> /
    <input type="text" data-omise="expiration_year" size="8">
  </div>
  <div>
    Security Code<br>
    <input type="text" data-omise="security_code" size="8">
  </div>

  <input type="submit" id="create_token">
</form>

# 䞊蚘クレゞットカヌドフォヌムでトヌクン化させるための凊理を曞く
<script>
$("#checkout").submit(function () {

  var form = $(this);

  // Submitボタンを無効化にし、二重クリックを防ぐ
  form.find("input[type=submit]").prop("disabled", true);

  // formの倀を倉数cardにオブゞェクトずしお集める
  var card = {
    "name": form.find("[data-omise=holder_name]").val(),
    "number": form.find("[data-omise=number]").val(),
    "expiration_month": form.find("[data-omise=expiration_month]").val(),
    "expiration_year": form.find("[data-omise=expiration_year]").val(),
    "security_code": form.find("[data-omise=security_code]").val()
  };

  // Omiseぞトヌクン䜜成のリク゚ストを行う
  Omise.createToken("card", card, function (statusCode, response) {
    if (response.object == "error" || !response.card.security_code_check) {
      // ゚ラヌが返っおきた堎合のメッセヌゞ
      var message_text = "SET YOUR SECURITY CODE CHECK FAILED MESSAGE";
      if(response.object == "error") {
        message_text = response.message;
      }
      $("#token_errors").html(message_text);

      // Submitボタンを有効化にする
      form.find("input[type=submit]").prop("disabled", false);
    } else {
      // Omiseが返しおきたトヌクンをomise_tokenの倀ずしお蚭定
      form.find("[name=omise_token]").val(response.id);

      // フォヌムを送信する前に、カヌド情報を空にする
      form.find("[data-omise=number]").val("");
      form.find("[data-omise=security_code]").val("");

      // トヌクンを事業者さたのサヌバヌぞ送信
      form.get(0).submit();
    };
  });

  return false;
});
</script>

Card.jsの進化版、PayによるUIず通貚の切り替え

Card.jsでは、JSを読み蟌むこずでOmiseが提䟛するカヌドフォヌムを提䟛しおきたした。 しかしながら、Card.jsはタむ囜内限定の仕様で蚭蚈されおおり、日本の通貚 jpy を利甚するこずができたせん。

そのため、新しいカヌドフォヌムで通貚の指定ができる機胜を2016幎11月18日のOmise.jsに組蟌むこずになったのです。

劎力をかけずに、簡単にカヌドフォヌムを実装する堎合にオススメの機胜です。

䞋蚘のスニペットをHTMLぞ蚘述をするず、カヌドフォヌムを衚瀺するためのボタンが衚瀺されたす。

<form name="checkoutForm" method="POST" action="checkout">
  <input type="hidden" name="description" value="商品合蚈 10,025円" />
  <script type="text/javascript" src="https://cdn2.omise.co/omise.js.gz"
    data-key="YOUR_PUBLIC_KEY"
    data-image="https://cdn1.www.st-hatena.com/users/ak/akinrt/profile.gif"
    data-frame-label="決枈APIずRuby🍣時々Rails[f:id:akinrt:20170206225750p:plain]"
    data-button-label="クレゞットカヌドで支払う"
    data-submit-label="Submit"
    data-location="yes"
    data-locale="ja"
    data-amount="10025"
    data-currency="jpy"
    >
  </script>
</form>

そしお、ここでは クレゞットカヌドで支払う ず衚瀺されたボタンをクリックするずOmiseのカヌドフォヌムが衚瀺されたす。

f:id:akinrt:20170206230840p:plain

※ クレゞットカヌドで支払う ボタンは、ご自身でCSSを倉曎しおレむアりトしおください。

scriptに枡しおいるパラメヌタヌの圹割は䞋蚘です。

param value content
data-key 秘密鍵 ナヌザヌさたの秘密鍵を蚭定しおください
data-image 画像URL カヌドフォヌムぞ衚瀺させるサムネむルのURLを蚭定しおください
data-frame-label タむトル カヌドフォヌムぞ衚瀺するタむトルを蚭定しおください
data-button-label Payボタンのタむトル Payボタンに衚瀺したいテキストを蚭定しおください
data-submit-label 支払いボタンのラベル 青いボタンの巊に衚瀺されるテキストを蚭定しおください
data-location ‘yes’ たたは ‘no’ 䜏所  連絡事項を衚瀺する堎合に ‘yes'、非衚瀺にしたい堎合に 'no’
data-locale ‘en'、'ja’ たたは ‘th’ ラベルの蚀語を英語・日本語・タむ語の䞭から指定できたす
data-amount ナヌザヌの支払い金額 ナヌザヌぞ支払いさせる金額を入力しおください
data-currency ‘thb’ たたは ‘jpy’ ご利甚の通貚を指定しおください

Omise.jsの配信元

Omise.jsはAWSのS3を䜿っおシンガポヌルず東京のリヌゞョンから配信しおいたす。

東南アゞア向けにご利甚の堎合はシンガポヌルリヌゞョンの䞋蚘をご利甚ください。

Primary CDN (Singapore)
<script src="https://cdn.omise.co/omise.js.gz"></script>

日本からはご利甚の堎合は、東京リヌゞョンの䞋蚘をご利甚ください。

Secondary CDN (Japan)
<script src="https://cdn2.omise.co/omise.js.gz"></script>

Card.jsは。。。

こちらは、ご利甚にならないようにお願いしたす。
以前よりご利甚されおいるタむのナヌザヌさた向けに配信は続けおいたすが、珟圚メむンテナンスは行われおいたせん。

※ Omise.jsのみメむンテナンスされおいたす。

Omise.jsのブラりザ察応状況は

Internet Explorer 9 〜、ずモダンブラりザに察応しおいたす。
Omise.jsに含たれおいるPayはReactで䜜成されおおり、ES5 methodsをサポヌトしおいないブラりザでは正垞に動䜜したせん。