ayumu_aoの日記

SIerから事業会社に転職したエンジニアがなにかを垂れ流してます

AWS Summitに行ってきた!レポート※セッションメモ (2017/05/31)AmazonPayの仕組みと実装方法

【ライブコーディングも実施】AmazonPayの仕組みと実装方法

自己紹介

  • ジョナサン
  • 吉村周造

アジェンダ

Amazon Payの3つの特徴

  • 利便性 AmazonIDひとつでOK
  • スピード 入力不要で最短2clickで完了
  • 安心感 マケプレ保証の対象

導入実績

  • 2,016年10月時点で1,000社を超えた

エンジニアとは

なにもないところから人の人生を豊かにする(社会貢献をする)

Amazon Payと日本赤十字社

熊本地震

  • 被災状況  物資支援はありがたいのだけれども。。。
  • Amazon Customerの要望  寄付はしてみたいんだけど
  • 赤十字社の要望  より多くの方にWeb経由で寄付してほしい

困っている人がいる →エンジニアがやらねば!!!

Amazon Payで寄付するための課題

  1. 信頼できるページ管
  2. 理を楽にしたい
  3. すぐに開始したい

Amazon Payの仕組み

  • フロントエンド↔バックエンド
  • フロントエンドはJSでだけで実装できる
  • バックエンド SDKがあるのでそれを経由してAPIをコール

API GateWay+Lambda+DynamoDBで寄付ページを作成できた!

課題の解決

  1. Amazonの中に
  2. AWSを使ってるので楽ちん
  3. →LambdaのPGは1週間くらいでできた

そして、グローバルでも利用できる!

Amazon Pay購入画面BestPracticeとは

ECサイトのゴールはなんですか? →商品購入→たくさんの商品を購入してほしい

カゴ落ち

  • カートに入れても購入しないこと ※購入するときに面倒だから(入力項目が多すぎる)
  • 平均的に購入画面である入力項目は38個もある!!!

商品購入の機会最大化

ECサイトのゴールデンルール
  • 1ページで注文・購入を確定させる
  • 項目は最小限に
  • ゲスト購入OK OptIN形式で会員登録させる

※ユーザーは我慢強くないということを理解すべき!

ここからライブコーディング

必須事項:

  • AmazonPayのJSライブラリを読み込む
  • クライアントクレデンシャルAPIを利用するための項目を指定する
  • (個人的な所感)アクセストークン系をどう秘匿するかは検討かなー

コードはGitHub上に公開されるとのこと リファレンスはAmazonPayのページ参照

まとめ

エンジニアはお客様のため、社会貢献をおこっていきましょう!