プライベートアプリのネイティブアプリでAPIにアクセスするまでの流れ

弊社の店頭でスマレジを使用し、弊社内の販売管理システムとデータのやり取りをするための仕組みを構築中です。

データのやり取りは、1日1回のバッチ処理を想定しており、外部にWebサーバを公開する予定がないので、プライベートアプリの、ネイティブアプリとなるかと思います。

この場合で、APIにアクセスする流れを教えて頂きたいです。

例えば、PostmanでAPIに接続するにはどういう流れでどういう手順となるのでしょうか。

ベストアンサー

  • @キング西村

    手順は合っていますがParamsの内容が一部違っていたり、足りない項目があります。


    【違っている項目】

    scope:openid offline_access 使用するスコープ(pos.products:readなど)

    →上記のように指定する必要があります。

     offline_accessと使用するスコープがVALUEに入っておりませんので追加してください。

     なお、使用するスコープについては使用したい機能によって異なります。

     例えば、商品一覧取得を行うためには「pos.products:read」が必要になります。


    【足りない項目】

    code_challenge

    →ネイティブアプリの場合、上記の項目は必須になります。


    以上を修正したURLをブラウザで開き、

    「アプリがアカウントへのアクセスをリクエストしています」

    と画面上部に表示されたページにて、「許可する」をクリックすると、

    認可コードが取得できるかと存じます。エラーが発生する場合は再度ご連絡くださいませ。

  • @キング西村

    なお、最初誤って、code_challengeを 43文字以上のランダムな文字列を直接BASE64エンコードすると、先に進んで認可コードを取得できたのですが、SHA256ハッシュ値経由は必要なのでしょうか。

    SHA256ハッシュ値を経由することは必要です。

    「SHA256ハッシュ」はバイナリデータであり文字列として表示できないため16進数表記で表示されるのですが、

    記載いただいたツールと手順ではSHA256ハッシュそのものではなく、

    SHA256ハッシュの16進数変換された値をbase64エンコードしているためエラーとなっています。


    そのため、SHA256ハッシュを16進数表記に変換せずにbase64エンコードする必要があるのですが、

    それを処理するためのツールが以下になります。

    Online PKCE Generator Tool

    上記ツールではSHA256ハッシュそのものをbase64エンコードすることが可能です。

    また、こちらはOAuthという規格に準拠したツールであり、スマレジの認可基盤もその規格に沿ったものになりますので、

    こちらのツールを使って「code_challenge」の値を生成するとエラーもなく認可コードが取得できるかと思います。

  • @キング西村

    仰る通り、code_verifier の値が不正な可能性があります。

    ユーザーアクセストークンの取得の際のBodyに入れるcode_verifierの値には、

    ユーザー認可の要求のParamsに入れるcode_challengeの値のSHA256ハッシュ&base64エンコード前の値を入れる必要があります。


    例えば、以下のランダムな文字列を使用するとします。

    tLrjal3PflURDOWlYU6XCIxRh1sRaJBisTxLT6IM3cU

    こちらを先日お伝えしたOnline PKCE Generator ToolのCode_verifierに入力し、

    「Generate Code Challenge」をクリックすると、以下のような値が生成されます。


    ユーザー認可の要求では上の画像のcode_challengeの値である、

    mr9_1pXzirgQQlwBKGd9DPSaqT68tbPlFbpPsRSpv9Uを使用し、

    ユーザーアクセストークンの取得では上の画像のCode_verifierの値である、

    tLrjal3PflURDOWlYU6XCIxRh1sRaJBisTxLT6IM3cUを使用します。


    上記の例を参考に今一度Code challengeの値を取り直して、

    ユーザー認可の要求→ユーザーアクセストークンの取得を試していただけますか?

    改善しない場合は使用しているcode_verifierの値を教えてください。

答え

  • @ryou

    プライベートアプリのネイティブアプリでは、ユーザーアクセストークンを使用してAPIにアクセスします。

    手順は以下の通りです。


    ①ユーザー認可の要求

    ②認可コードの取得

    ③ユーザーアクセストークンの取得

    ④取得したユーザーアクセストークンを使用して、各種APIにアクセスする


    ①~③については以下の仕様書をご確認ください。

    ④については使用したい機能の部分を以下の仕様書にてご参照ください。

    例えば、PostmanでAPIに接続するにはどういう流れでどういう手順となるのでしょうか。

    こちらにつきましては一度上記の仕様書をご確認の上、Postmanでの操作を行っていただけますでしょうか。

    その上でエラーが発生する場合はエラー内容をご教示ください。

    また、Postmanの画面のスクリーンショットを共有いただければ、

    詳細なご案内も可能となりますのでご検討くださいませ。

  • November 2022 編集されました

    @スマレジ 輪島

    ご回答ありがとうございます。

    以下、案内された手順でやってみましたが、途中で詰まってしまいました。

    ①URLを生成する


    ②ブラウザに張り付けると、ログイン画面が表示されるので、デベロッパーアカウントでログイン



    ③エラー


    そもそもやり方が合っているのでしょうか。

  • @スマレジ 輪島

    ご回答ありがとうございます。仕様書のリクエストパラメータの必須列の「※」は、必須かつ補足ありという意味なんですね。任意項目だと思い込んでいました。

    ご指摘いただいた手順で進めましたが、やはりエラーとなってしまいました。

    ご指摘されたパラメータを付与して、作成されたURLにブラウザでアクセス

    code_challenge は、43文字以上のランダムな文字列からSHA256ハッシュ値を算出し、BASE64でエンコードしてセット


    この後、ログイン画面が同様に表示され、デベロッパーアカウントでログインするも、前回と同じエラーの画面が表示されました。

    なお、最初誤って、code_challengeを 43文字以上のランダムな文字列を直接BASE64エンコードすると、先に進んで認可コードを取得できたのですが、SHA256ハッシュ値経由は必要なのでしょうか。

    なお、以下のサイトでハッシュ値を出して、

    SHA256ハッシュ生成ツール | ハッシュジェネレータ (milk-island.net)

    その結果を以下のサイトでbaser64エンコードしました。

    base64エンコード/デコードツール|株式会社エン・PCサービス (en-pc.jp)

    お手数おかけしますが、ご回答お願いします。

  • November 2022 編集されました

    @スマレジ 輪島

    ご回答ありがとうございます。

    OAuthの知識に疎くてすいません。

    無事、認証コードの取得まではたどり着けましたが、次のSTEPのユーザーアクセストークンの 取得で躓いてしまいました。

    Postmanで以下のようにリクエストを作成しましたが、エラーが返ってきました。


    * Authrizationの Username に、client_Idをセット。パスワードはブランク

    * Body に指定のパラメータをセット


    * 結果

    {

        "type": "https://api.smaregi.jp/problems/oauth2/invalid_grant",

        "title": "Invalid Grant",

        "status": 400,

        "error": "invalid_grant",

        "error_description": "The provided authorization grant (e.g., authorization code, resource owner credentials) or refresh token is invalid, expired, revoked, does not match the redirection URI used in the authorization request, or was issued to another client.",

        "hint": "Failed to verify `code_verifier`.",

        "detail": "The provided authorization grant (e.g., authorization code, resource owner credentials) or refresh token is invalid, expired, revoked, does not match the redirection URI used in the authorization request, or was issued to another client."

    }


    リクエストBodyの

    code には、ブラウザでコピーして認証コードをセット

    code_verifier には、ユーザー認可の要求で設定した code_verifier と同じデータをセットしました。が、エラーだったので、平文(ハッシュ&エンコード前のワード)をセットしたものの結果は同じでした。

    ヒントにもあります通り、ここの設定内容が不正な気がしますが、何を設定すれば良いのでしょうか。

    重ね重ねすいませんがご回答お願いします。

  • November 2022 編集されました

    @スマレジ 輪島

    ご回答ありがとうございます。

    ご指定のcode_beryfierとcode_challengeをそのまま使用してやってみたところ、正常にレスポンスが返ってきました。

    レスポンスのaccess_tokenを使用して、APIを呼び出すこともできました。ご対応ありがとうございます。


    また、本番環境に向けても同じ手順で試したところ正常にAPIからデータを抽出することができました。

    重ね重ねご対応ありがとうございました。


    最後に、ここまできて勘違いが判明したのですが、プライベートアプリのネイティブアプリだと、入出荷などのAPIへのアクセス権限できない仕様のようでした。

    今回の要件:バッチ処理での自動連携 → Webアプリではない → ネイティブアプリ

    という安直な考えで、今回の要件ではネイティブアプリだと思っていたのですが、仕様を見るにシステム間での自動連携をする場合は、Webアプリを選択しなかればならないという認識で良いのでしょうか。Webアプリだと、Webhookによるコールバック処理などが必須なものだと思い込んでいました。

    ネイティブアプリを選択する際のポイントは、何なのでしょうか。

    最後に、変な質問で大変申し訳ありませんが、ご回答頂けるとありがたいです。

  • @キング西村

    ユーザーアクセストークンでのプラットフォームAPIへのアクセスは各機能対応状況が異なっているため、

    ご認識の通り入荷や出荷のAPIはユーザーアクセストークンを使用してのアクセスは出来ません。

    また、WEBアプリとネイティブアプリの主な違いは以下の通りです。


    【WEBアプリ】

    サーバーサイドでAPIをコールするようなアプリケーションの場合に選択します。

    クライアントシークレットが発行されるため、アプリレベルのAPIコールとなり、

    また、秘匿性の高いサーバーでの利用を想定しています。


    【ネイティブアプリ】

    クライアントサイドでAPIをコールするようなアプリケーションの場合に選択します。

    クライアントシークレットが発行されないので、ユーザーレベルのAPIコールとなります。

    また、アプリのソースコードをアップする環境は必要ですがサーバーを用意する必要がありません。


    開発されるアプリがどのようなAPIコールになるのかを判断基準として、

    WEBアプリかネイティブアプリかを選んでいただければと思います。

  • @スマレジ 輪島

    ご回答ありがとうございます!

    今回は、サーバは立てるので、Webアプリとして作成します。

    何度もご回答頂きありがとうございました。