ãªã³ã©ã€ã³æ±ºæž Omise ã§å決æžã®å®è£
Omiseãæšå¹Žã®2016幎06æ14æ¥(ç«)ããæ¥æ¬åãã«å決æžãæäŸããŠããããšãçããã¯ãåç¥ã§ããããïŒ æ¥æ¬ã®æ³äººã»å人åãã«æ¥æ¬åã§ã®æ±ºæžãã§ããã®ã§ãã
现ããããšæãã§ãã²ã¹ãã¢ã«ãŠã³ãã§ããã£ãšå決æžãOmise Rubyã©ã€ãã©ãªã§è©Šãæ¹æ³ããŸãšããŠã¿ãŸãã
ã²ã¹ãã¢ã«ãŠã³ãã§ãµã€ã³ã¢ããïŒ
ãã¹ãã¢ã«ãŠã³ããäœãæéãçããããã²ã¹ããµã€ã³ã¢ãããå©çšããŸãã
Omiseã®ç»é²ãºãŒãž ãžç§»åãã ã²ã¹ããšããŠãµã€ã³ã¢ãããã
ã®ããã¹ããªã³ã¯ãã¯ãªãã¯ã
ã¢ã«ãŠã³ãäœæã®ããŒãžãžç§»åããåŸã«ãæ¥æ¬ãéžæããå¥çŽå
容ã«åæã«ãã§ãã¯ãã€ããŠã¢ã«ãŠã³ãäœæãã¿ã³ãã¯ãªãã¯ããŸãã
ãã®åŸ ãã¹ãã㌠ãååŸããŸãïŒ
å
¬ééµïŒãããªãã¯ããŒïŒãšç§å¯éµïŒã·ãŒã¯ã¬ããããŒïŒãããã®ã§ããããåŸã»ã©å©çšããŸãïŒ
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 ãäœããŸãã
ããã䜿ãã°ãã¹ãã«ãŒãããŠã§ããµã€ãããæ¢ããªããŠãç°¡åã«å©çšã§ããããã«ãªããŸãïŒ
Omise åçšãžç§»è¡ããæã«ãäŒããããããšïŒããŒã¯ã³ãšãªãŒãœãªïŒ
åçšãžç§»è¡ãããå®éã«èª²éããã¹ããããããšãããããšæããŸãã
ããã§ã¯ãåçšãžç§»è¡ãããæã«ç§ãã¡ãäŒããããŠããªãïŒïŒãšå人çã«ã¯æããŸãïŒæ
å ±ã説æããããšæããŸãã
1. åçšã¢ãŒãã§ã®ããŒã¯ã³äœæã£ãŠäœãããŠããã®ïŒ
ã«ãŒãã®æå¹æ§ãã§ãã¯ãè¡ããŸãã
ãã®ãããæ¥æ¬ã®å çåºã§ã¯ãããŒã¯ã³ãäœæããæã«ã«ãŒããå®éã«äœ¿ãããã確èªããããäžèšã®ããšãè¡ããŸãã
ã¯ã¬ãžããã«ãŒãã®å Žå
- ããŒã¯ã³ãäœæéå§
- éä¿¡ããã«ãŒãã§100åã®äžä¿¡ãè¡ã100åã®æ ãæãã
- 100åã®äžä¿¡ãæåããã°ã100åã®äžä¿¡æ ãè§£æŸãããã®ã¿ã€ãã³ã°ã§ã®æå¹æ§ã確èªã§ãããšããŠäœ¿ãããšå€æãã
- 100åã®äžä¿¡ãæåããªããã°ãããŒã¯ã³äœæããšã©ãŒã«ãªã
ããããã«ãŒãã®å Žå
- ããŒã¯ã³ãäœæéå§
- éä¿¡ããã«ãŒãã§100åãæ¬å£²äžãã
- 100åã®æ¬å£²äžãæåããã°ã100åã®è¿éããããã®ã¿ã€ãã³ã°ã§ã®æå¹æ§ã確èªã§ãããšããŠäœ¿ãããšå€æãã
- 100åã®æ¬å£²äžãæåããªããã°ãããŒã¯ã³äœæããšã©ãŒã«ãªã
ã¯ã¬ãžããã«ãŒããšããããã«ãŒãã§èšèãè¥å¹²éããŸããã100åã§èª²éã§ãããã確èªããŠããã®ã¿ã€ãã³ã°ã§ã®ã«ãŒãã®æå¹æ§ã確èªããŠããŸãã
ã§ãã®ã§ãã»ãã®å°ãã®éã ã100åã®äžä¿¡æ ã確ä¿ãšè§£æŸããæéãã«ãŒãã«çºçããŸãã
決æžã®è£äºæ
ã§ãããããã
â»æå¹æ§ãã§ãã¯ããªãŒãœãªãšããããŸãã
â»ããããã«ãŒãã®å Žåãæçްæžã«100åã®åºéãšè¿éãå±¥æŽã«æ®ãããã§ãã
引き落としのギモン|Visaデビット|ジャパンネット銀行
2. ãã®ã¿ã€ãã³ã°ã§ã®ã«ãŒãã®æå¹æ§ã£ãŠïŒ
ã€ãŸããã«ãŒãã䜿ãããšããæã«ãã«ãŒãããŸã 䜿ããç¶æ ããšããããšã§ãã
次ã®äŸã®å Žåã課éïŒChargeïŒäœæã®æã«å€±æããããšããããŸãã
- äžä¿¡æ ãæ®ã2000åã®ã«ãŒãã§ãã«ãŒããæ å ±ããã©ãŒã ãžå ¥åäž
- ã«ãŒããã©ãŒã ãžå ¥åäžã«ãã©ããã§ç»é²ããŠããå®æèª²éã§2000åã®äžä¿¡ãè¡ããã
- ã«ãŒãæ å ±ãå ¥åçµãããããŒã¯ã³äœæ
- ããŒã¯ã³äœæãšã©ãŒïŒ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ã®å ã«éçšãããéåžžã«é«ãã»ãã¥ãªãã£ã®å ã§æ¯æããã§ããŸãã
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ã®ã«ãŒããã©ãŒã ã衚瀺ãããŸãã
â» ã¯ã¬ãžããã«ãŒãã§æ¯æã
ãã¿ã³ã¯ããèªèº«ã§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ããµããŒãããŠããªããã©ãŠã¶ã§ã¯æ£åžžã«åäœããŸããã