突然ですが、みなさんスマレジってご存じですか?
スマレジは、2019年2月にマザーズ上場を果たした大阪のITベンチャーが
開発・運営を行っているiPhoneやiPadを使用したクラウドPOSレジシステムで、
ショップやレストランなど様々な業態で使用されています。
スマレジには、外部開発パートナーがスマレジのデータを活用して
アプリ開発・販売ができるアプリマーケットがあります。
いろんなアイデアを試してビジネスチャンスを広げるいい機会になると思い、
わたしたちJoBinsは早速**「引換券モニターアプリ」**を作ってみました!
よくファストフード店なんかに行くとありますが、
料理ができたらレシートに書かれている引換番号がモニターに表示される「あれ」です。
あの機能をスマレジに搭載してほしい店舗はごまんといるはず…!(売れるに違いない!)
そう思い、店舗が呼び出した時にカスタマー用のモニターに引換番号が出て音が鳴る、
というシンプルなWebアプリを作りました。
せっかくなので、このアプリ開発のプロセスについて6回に分けてお伝えしていきます!
前置きがだいぶ長くなりましたが。。。
第1回目はアプリの登録・各種設定方法やPostmanを使ってスマレジのAPIを利用する方法について説明します。
##アプリの登録・各種設定
スマレジのAPIを使ってアプリ開発するために、まずはスマレジDevelopersからデベロッパーアカウントを作成します。(ちゃんと利用規約も読みましょう!)
アプリを新規登録する
デベロッパーアカウントをゲットしたらログインし、
サイドメニューの「アプリ」から新規登録を行います。
新規登録ボタンから登録フォームにいき、必須項目を入力します。
アプリのアイコンなど、「申請時に必要」な項目もありますが、
これらは後から入力すればOKなのでとりあえず「必須項目」だけ入れて登録しましょう。
アプリ登録フォームの必須項目
- アプリ区分: 今回はWEBアプリを選択。
- サービス種類: WEBアプリなので今回は選択不要。
- アプリ名: 名前から機能を連想できるようなアプリ名にしましょう。(例:引換券モニター)
- バージョン: アプリのバージョンなので、最初は「1.0.0」とでもしましょう。
登録すると、アプリの概要ページにリダイレクトします。
概要ページでは、APIのスコープ、Webhook、認証リダイレクトURLなどの重要な項目を設定できます。
アプリの削除方法
「間違えて登録しちゃった!」という時は、削除したいアプリの「概要を見る」をクリックし、
アプリの概要ページにいきます。
上の「基本情報」タブを開くと、ページの下の方に「削除ボタン」があります。
クライアントIDとクライアントシークレットをチェック
アプリを登録すると、クライアントIDとクライアントシークレットがアプリごとに発行されます。
これらはアプリの概要ページの「環境設定」タブで確認できます。
この2つはスマレジのAPIにアクセスする際に必要になります。
##Postman設定
では次にPostmanを使ってスマレジのAPIにアクセスしてみましょう!
すべてのAPIには認証が必要なので、access_token
を取得するには「スマレジ契約ID」、「クライアントID」、「クライアントシークレット」が必要になります。
この access_token
は、他のAPIをリクエストする際に使用します。
各APIの仕様書はメニューバーの「ドキュメント」の中の「仕様書」タブにあります。
環境によりエンドポイントURLが異なるので、このドキュメントではSandbox環境を対象に例を記載しています。
Sandbox環境 | 本番環境 | |
---|---|---|
アクセストークンAPI | https://id.smaregi.dev | https://id.smaregi.jp |
プラットフォームAPI | https://api.smaregi.dev | https://api.smaregi.jp |
アプリアクセストークンを取得する
アクセストークンを取得するには、次のリクエストパラメータを使用してPOST
リクエストをエンドポイントに送信します。
エンドポイント
https://id.smaregi.dev/app/{contractID}/token
リクエストヘッダー
Authorization: Basic {Base64 client_id:client_secret}
Content-Type: application/x-www-form-urlencoded
リクエストボディ
grant_type: client_credentials
scope: 要求するAPIスコープ。複数の場合は半角スペースで結合して指定します。
要求するAPIスコープは、アプリ概要ページの「スコープ」タブから設定できます。
有効ではないスコープを要求しても無視され、存在しないスコープを含む場合はエラーを返します。
たとえば、店舗リストを取得したい場合は、pos.stores:read
を有効にします。
アプリアクセストークンをPostmanを使って取得する
Postmanで環境変数を設定すればアクセストークンを取得するのは超絶カンタンで、
シンプルにPOST
リクエストをエンドポイントURLに送信するだけです。
設定方法は以下の通り。
Authorization
「Basic auth」に設定し、Usernameにclient_id
を、Passwordにclient_secret
を入れます。
Headers
Content-Type: application/x-www-form-urlencoded
Body
「x-www-form-urlencoded」にチェックして、以下のように入力します。
grant_type: client_credentials
scope: pos.stores:read pos.stores:write
これらが正しく設定されていると、下の画像のようにaccess_token
を取得できます。
###Postmanから店舗一覧を取得する
次に、取得したアクセストークンを使って、店舗一覧を取得できるか確認してみましょう。
①「Authorization」タブでTYPEを「Bearer Token」に設定する
②先程取得したアクセストークンをTokenに入力する
③下記のエンドポイントにGET
リクエストを送信する
https://api.smaregi.dev/{contract_id}/pos/stores/
※{contract_id}
は自分のidに変更すること
店舗一覧取得の詳細についてはこちらで確認できます。
##Postman環境設定ファイル
つらつらと書きましたが、「めんどくさいわ!」という方は
Githubにファイルをアップしているのでよかったらご利用ください!
第1回目はアプリの登録とPostmanの設定のポイントにについてお送りしました。
次回はアプリの仕様設計についてお届けします!