※ これから記載する事項は、私が所属する会社とは一切関係のない事柄です。
この記事はヘッドレス API の使い方のシリーズの一つです。その他の記事は下記を参照してください。
今回は SCAPI パブリッククライアントを利用したショッパー系 API の呼び方を紹介したいと思います。
- データ系とショッパー系の違いについては「データ系 API 編 」を参照してください。
- SCAPI のショッパー系の API の認証する際には ２ つのクライアントタイプがあります。タイプの違いについては、「ショッパー系 API - SCAPI プライベートクライアント編」を参照してください。
この記事では、SCAPI のパブリッククライアントで ３ つの顧客タイプが商品をカートに追加するユースケースを説明します。
- ゲストユーザ ・・・ ログインしていないユーザ
- 登録済みユーザ(B2C Login) ・・・ B2C Commerce に登録済みユーザ
- 登録済みユーザ(Federated Login) ・・・ Google や Facebook といったIDプロバイダーを利用して(Federated Login)ログインしたユーザ
ショッパー系APIの呼び方
1. API クライアントの作成
2. スコープの設定
3. (Federated Login のために) Google OAuth2.0 の設定
4. (Federated Login のために) IDP を登録
１〜４ は、「ショッパー系API - SCAPI プライベートクライアント編 」と同じなので割愛
5. SLAS テナントの登録
「Create a SLAS Client」を参照してください。
この際に、 [Private?] の値を false に [Redirect URI] の値にコールバックで処理する自身のアプリケーションのエンドポイントを設定してください。(例：http://localhost:3000/callback)
この時生成した Client Id と Secret をメモしておいてください。
6. アクセストークンの取得
ゲストユーザ
- まずは下記のようなリクエストでユーザーがログインをする。
-
shortCode、tenantID、orgID、siteID、realmIDについては 「B2C Commerce に関わる ID を把握」 を参照してください。 -
clientIDは 「5.SLASテナントの登録」 で設定したclientIdの値を入力 -
redirectUriはコールバックで処理する自身のアプリケーションのエンドポイントを入力 -
code_challengeはcode_verifierという 43 ～ 128 文字の文字列を SHA256 でハッシュ化したものを入力。（ロジックは公開されているPostmanコレクションの Pre-request Script を参照）
-
REQUEST:
GET /shopper/auth/v1/organizations/{orgID}/oauth2/authorize
?redirect_uri={redirect_url}
&response_type=code
&client_id={clientID}
&hint=guest
&code_challenge={codeChallenge} HTTP/1.1
Host: {shortCode}.api.commercecloud.salesforce.com
- 上記のリクエストをすると HTTP ステータスが 303 でレスポンスヘッダーの
Locationに{redirectUri}?usid={}&code={}（例：http://localhost:3000/callback?usid={}&code={}）のフォーマットで URL が入っているので、その URL にブラウザでリダイレクトさせる。 - 自身のアプリケーションで、
/callbackを実装し、codeの値を利用して下記のリクエストを行い、レスポンスボディ内のaccess_tokenを取得-
code_verifierはcode_challenge生成時に利用した文字列。（ロジックは公開されている Postman コレクションの Pre-request Script を参照） -
codeはリダイレクト先（Location） URL のパラメータに入っているcodeを入力
-
REQUEST:
POST /shopper/auth/v1/organizations/{orgID}/oauth2/token HTTP/1.1
Host: {shortCode}.api.commercecloud.salesforce.com
Content-Type: application/x-www-form-urlencoded
REQUEST PARAMETER:
grant_type=authorization_code_pkce
&client_id={clientID}
&redirect_uri={redirectUri}
&code_verifier={codeVerifier}
$code={code}
登録済みユーザ(B2C Login)
- まずは下記のようなリクエストでユーザーがログインをする。
-
usidはゲストユーザのトークン取得時のレスポンスボディにあるusidに値を入力 -
userCredentialは ユーザ ID / パスワード、それらをid:passwordのようにコロン(:)で結合したものを Base64 でエンコードした値です。
-
REQUEST:
POST /shopper/auth/v1/organizations/{orgID}/oauth2/login HTTP/1.1
Host: {shortCode}.api.commercecloud.salesforce.com
Authorization: Basic {userCredential}
Content-Type: application/x-www-form-urlencoded
REQUEST PARAMETER:
grant_type=client_credentials
&client_id={clientID}
&redirect_uri={redirectUri}
&channel_id={siteID}
&code_challenge={codeChallenge}
&usid={usid}
- 上記のリクエストをすると HTTP ステータスが 303 でレスポンスヘッダーの
Locationに{redirect_uri}?usid={}&state={}&scope=openid%20offline_access&code={}のフォーマットでURLが入っているので、その URL にブラウザでリダイレクトさせる。 - 自身のアプリケーションで、
/callbackを実装し、codeの値を利用して下記のリクエストを行い、レスポンスボディ内のaccess_tokenを取得
REQUEST:
POST /shopper/auth/v1/organizations/{orgID}/oauth2/token HTTP/1.1
Host: {shortCode}.api.commercecloud.salesforce.com
Content-Type: application/x-www-form-urlencoded
REQUEST PARAMETER:
grant_type=authorization_code_pkce
&client_id={clientID}
&redirect_uri={redirectUri}
&code_verifier={codeVerifier}
$code={code}
登録済みユーザ(Federated Login)
- まずは下記のようなリクエストでユーザーがログインをする。
-
IDPIDは 「4.(Federated Loginのために) IDP を登録」 で作成したIDPID。今回はgoogle
-
REQUEST:
GET /shopper/auth/v1/organizations/{orgID}/oauth2/authorize
?redirect_uri={redirect_url}
&response_type=code
&client_id={clientID}
&hint={IDPID}
&channel_id={siteID}
&usid={usid}
&code_challenge={codeChallenge} HTTP/1.1
Host: {shortCode}.api.commercecloud.salesforce.com
- 上記のリクエストをすると HTTP ステータスが 303 でレスポンスヘッダーの
Locationにhttps://accounts.google.com/o/oauth2/auth?scope=openid%20email%20profile&response_type=code&client_id={}&redirect_uri={}&state={}のフォーマットで URL が入っているので、その URL にブラウザでリダイレクトさせる。 - すると画像のように Google のログイン画面に遷移するので、ログイン。
Google Cloud Platform の OAuth 同意画面ページで公開ステータスを「テスト」でテストユーザを設定している場合は、そのユーザでログインしてください。
- ログイン成功すると
http://localhost:3000/callback?usid={}&code={}のフォーマットの URL にブラウザでリダイレクトさせる。 - 自身のアプリケーションで、
/callbackを実装し、codeの値を利用して下記のリクエストを行い、レスポンスボディ内のaccess_tokenを取得
REQUEST:
POST /shopper/auth/v1/organizations/{orgID}/oauth2/token HTTP/1.1
Host: {shortCode}.api.commercecloud.salesforce.com
Content-Type: application/x-www-form-urlencoded
REQUEST PARAMETER:
grant_type=authorization_code
&redirect_uri={redirectUri}
&code={code}
&code_verifier={codeVerifier}
&channel_id={siteID}
7. ショッパー系 API を呼ぶ
７ は、「ショッパー系 API - SCAPI プライベートクライアント編」と同じなので割愛します。