Magento2-AmazonPayセットアップガイド
この記事は公開から 1年以上が経過しています。現在の最新情報との整合性については弊社では一切の責任を負いかねます。
本記事では、Magento2.2.4から標準バンドルされるようになったAmazonPayエクステンションのセットアップ方法を解説していきたいと思います。
開発環境
- magento/product-community-edition: 2.1.13
- amzn/amazon-pay-and-login-magento-2-module : 1.2.6
Magento2.1.13にAmazonPay推奨バージョンである1.2.6をインストールします。 AmazonPay2.x.x系の開発も進んでいるようですが、未だ開発段階といった様子です。
目次
- Amazon セラーセントラル側の設定
- 1.1 セラーセントラルにログイン
- 1.2 アプリケーションの登録
- 1.3 アクセスキーの取得
- Magento側の設定
- 2.1 アクセスキーの設定
- 2.2 各種設定
- 2.3 Javascript・リダイレクトURLの設定
- テスト購入用アカウントの作成
- 動作確認・まとめ
1.Amazon セラーセントラル側の設定
まず初めにセラーセントラル側へ、Magentoアプリケーションを登録します。
1.1 セラーセントラルにログイン
Amazonセラーセントラルのページに飛び、各種設定をしていきます。
https://sellercentral.amazon.co.jp/home
所有しているアカウントのメールアドレス・パスワードを入力して、ログインして下さい。
アカウントをまだ取得されていない方は、ご登録ボタンから会員登録を済ませておきましょう。
ログインが完了すると、ダッシュボード画面が現れます。
1.2 アプリケーションの登録
まずは、MagentoアプリケーションをAmazonセラーセントラルに登録する必要があります。
画面がテスト環境用になっていることを確認しましょう。
テスト環境用になっていることが確認できたら、赤枠で囲まれているアプリケーションを選択します。
画面が遷移したら、画面左上にある[新しいアプリケーションを登録する]ボタンをクリックします。
下図にならってサイト情報を入力していきます。
1.3 アクセスキーの取得
Magentoアプリケーションの登録が完了したら、次にアクセスキーを取得する必要があります。
アクセスキーの取得は、初めのダッシュボード画面より、 スタートガイド > ステップ2-必要なキーの確認 > クリック を選択して下さい。
AmazonPayのアクセスキー登録方法は大きく分けて2つ存在します。
- Merchant Id, Access Key Id, Secret Access Key, Client Id, Client Secret をMagentoに一つずつ入力していく方法
- Credentials JSONを用いて、一発で入力してしまう方法
JSONを用いて、一発で入れてしまう方が簡単でかつミスタイプが起こりにくいので今回はこちらの方法でいきたいと思います。
画面中央上部にある[MWSアクセスキー情報の取得]ボタンをクリックすると、出品者ID・アクセスキーIDなどその他諸々の認証情報を含んだJSONが表示されます。
このJSONは後にMagentoの管理画面より入力することになるので、必ず控えておきましょう。
2. Magento側の設定
Amazonセラーセントラル側で取得したアクセスキーを元に、Magento側で設定を進めていきます。
Magento側でのAmazonPayエクステンションの設定は管理画面より、 店舗 > 設定 をクリックして頂き、画面遷移の後、左ナビよりセールス > 支払方法を選択します。
2.1 アクセスキーの設定
先ほど取得したJSONをCredentials JSONに貼り付けます。
アクセスキーの設定はこれだけで問題ありません。空白になっているMerchantIdやセークレットキーなどはJSONを利用する場合はそのままで問題ありません。
2.2 各種設定
Payment Region : 日本
Sandbox : Yes (開発段階では必ずYesにしておきましょう。)
Enable Amazon Pay : Yes
Enable Login with Amazon : Yes
各種設定が済みましたら、右上のSAVEボタンをクリックして設定を保存しましょう。
上図のようなメッセージが表示されれば、アクセスキーの設定は完了です。
2.3 Javascript・リダイレクトURLの設定
アクセスキーの設定が完了しましたら、Magentoに表示されているJavascript・リダイレクトURLをAmazonのセラーセントラルに登録します。
Javascript・リダイレクトURLは先ほどアクセスキーを設定していた画面の下部に表示されています。
・Allowed Javascript Origins
・Allowed Return URLs
上記の2項目をメモしておきましょう。
メモした内容はAmazonセラーセントラルの先ほど作成したアプリケーション欄の下記2項目にペーストします。
・Javascriptの種類
・リダイレクトURL
ペーストして保存すると、ひとまずAmazonPayの設定は完了となります。
3. テスト購入用アカウントの作成
各種の設定が完了いたしましたら、次はテスト購入用アカウントを作成します。 アカウントの作成はAmazonセラーセントラルから簡単に作成することができます。
上図に従って、インテグレーション > テストアカウントを選択しましょう。
画面が遷移しましたら、[テストアカウント作成]ボタンより、テスト用アカウントを作成していきます。
名前・Eメール・パスワードを登録します。 住所はデフォルトで登録されていますので、そちらを使って頂くか、もしくはご自身で自由に設定して頂いても問題ありません。
設定が完了いたしましたら、アカウント作成ボタンを押しましょう。
以上でAmazonPayの設定方法・テスト用アカウントの作成方法の解説は終了です。
4. 動作確認・まとめ
設定が完了しましたら、次は動作確認です。
Magentoのフロントエンドから実際の動きを確認してみましょう。
配送先の画面にAmazonのボタンが配置されているのが確認できるかと思います。
このボタンをクリックすると、下図のようなポップアップが表示されます。
この入力欄に先ほど作成したテスト購入用アカウントのメールアドレスとパスワードを入力します。
ログインが完了したら、あとはクレジットカードを選択するだけです。
購入が完了すると、Amazonよりメールが飛んで来ますので、内容もしっかり確認しておきましょう。
以上でAmazonPayのセットアップガイドは終了です。
Magentoの管理画面とAmazonセラーセントラルの画面を行ったり来たりということになってしまいますが、
頭を整理して一つずつ設定していきましょう。