LoginSignup
0
1

More than 1 year has passed since last update.

freee APIの始め方(アプリをセットアップ/APIを使い始める準備~Integromatを使ってAPIコマンド実行)

Last updated at Posted at 2021-09-06

freee APIを使って、勤怠管理も見積書や請求書作成も自動化しちゃおう

freeeはとても便利ですが、freeeへ入力する作業自体に生産性はない。
APIを使えば、例えばスプレッドシートやフォームからfreeeを通した見積書や請求書作成、slackやスマホのGPS、同じくフォームからの勤怠登録など、勝手に情報が登録・更新されていくという道が開けます。
今回ノーコードiPaaSのIntegromatを使用して、APIを触ってみます。

Integromatとはを軽く

まずこれiPaaSなのですが、iPaaSとはから説明すると、記事中の写真のようにビジュアライズされたモジュールを用いて各SaaSを直感的に爆速にAPI連携するプラットフォームです。
中でもIntegromatは、月額約1000円から始められて、IFTTTやZapierとはレベル違いの実際のコーディングの代用に足る高度さ、そして圧倒的に使いやすいUIが特徴かと思います。
ただし、その高度さ故にかなりコーディング寄りで、完全にノンプログラマーの方が習得するには少しハードルが高い部分があると思います。
あと、資料に日本語はほぼ皆無。※これについてはノーコードやIntegromatの日本コミュニティなどに期待したい

ただJavascriptもしくはGASが分かる方はツールの学習コストはかなり低いと思います。
気なった方は、無料プランもあるので登録して使ってみてください。
https://www.integromat.com/?pc=revolutionary

まずはFreee側でアプリを作成

残念ながら海外発ツールで、会計はその国々で独特なため日本ユーザーしか使用を期待できないfreeeのモジュールなどはありません。
なのでモジュールなし(自分で各パラメータを設定する)のカスタムHTTP callで対応。

開発環境作成

freeeが用意してくれる開発環境テスト事業所があるのでまずはそちらを利用しましょう。
アプリストアに行き、開発者ページのタブに進んでテスト環境を作成する
https://app.secure.freee.co.jp/developers
キャプチャ.PNG

出てきた画面で、特に何もおさず
freee API利用を開始する
のボタンを押す。
30秒程度待つとfreeeから
開発用テスト事業所の作成完了のお知らせ
というメールが届くので、これで環境とテストアプリ出来上がり。

そのまま即コマンドを試したい方は届いたメールのアクセストークン取得ページに進んで、アクセストークンをコピーで拾ってAPIリファレンスで試すとよい。
image.png

Authをセットアップ

権限設定

案内には
アクセストークンを取得しに行け→APIリファレンスに行って試せ
とある。
が、そこではコマンドの確認程度しかできないので、開発者ページのタブに戻ってアプリの管理に移動。
勝手にできている開発用テストアプリ権限設定と進んで、テスト環境なのでとりあえず全部にチェックを入れて触ればいいと思います。
下書きを保存を押すのを忘れない。後のプロセスで401:Invalid access Tokenのエラーになる

ここでfreee APIのAuthのお約束解説

OAuth2.0の標準的な流れとして、固定パスワードのようなAPIキーよりは時間や回数制限のあるトークンを用いてのアクセスとなる。

APIドキュメントのAuthorization Code Flow部分にある通り、
-前述のメールから取得できるアクセストークン有効期限24時間
-Webアプリ認証用URLで取得する認可コード有効期限10分※後ほど解説
-24時間期限のアクセスコードの代わりに、時間の期限はないが、一回使い切りのリフレッシュトークンがある
image.png

実行環境(Integromat)セットアップ解説

お約束事が言っていることはつまり

永続的にアプリが動くようにするには
1.認可コードでアクセストークンを取得する認証APIを一発叩く
2.アクセストークンと共にリフレッシュトークンが返ってくる
3.リフレッシュトークンを実行環境がアクセスできる場所にストアリング
ということをまずやり、次回から
ストアしたリフレッシュトークンを保管場所から取得
認証APIをリフレッシュトークンを使って叩く
新たに発行されたアクセストークンで続くAPIコマンドを実行
という流れを組まないといけない。

具体的に言うとこう

image.png
Content-Type=application/x-www-form-urlencoded

https://accounts.secure.freee.co.jp/public_api/token
をURLにセットし、
作成されたアプリ詳細の基本情報からClient IDClient Secretをセット。
Webアプリ認証用URLをブラウザで開き、認可コードを取得してcodeにセット。
無題.png

※ここではgrant_typeをauthorization_codeにすることに注目

こうするとリターンがこうなる
無題.png

それを受けて、シナリオをこういう風に作り変える
image.png

無題.png

認証のAPIを叩く時はgrant_type=refresh_tokenに変更し、code=**の部分もrefresh_token={{前の認証リクエストで保管したR}}*にする。

その上でヘッダーにAuthorization= Bearer {{アクセストークン}}としてAPIを叩く
image.png

(スペース)Bearer(スペース){{R}}としないといけない気がするけどマジ!?
※適切な権限設定がないと401:invalid_access_token(ログインしてください)とエラーが返ってくる
※本番ではさすがにGoogleスプレッドシートは使わないでおこう

Integromatには便利なOAuth2.0用モジュールが

ここまで書いておいてですが、上記のようなことをしなくても、IntegromatにはGASのPropertiesServiceOAuth2 for Apps Script+PropertiesServiceの組み合わせを一つにしたような、Pythonのoauthlibのような、Refresh Tokenを内部で保持してくれるモジュールがあります。
Make an OAuth 2.0 request
image.png

freeeアプリの設定側でコールバックURL
https://www.integromat.com/oauth/cb/oauth2
に設定し、
※詳細はこちらhttps://www.integromat.com/en/help/app/http
このモジュールのConnection作成時に以下の用に設定すれば、一発でOAuth2.0への道が開けます。
ヘッダーにも何も設定しないでOK!
image.png
※Client ID とSecretは前述の方法と同様にセットしてね

あとがき

次回はfreee APIとIntegromatを使って実際にどんなものを作ったか、などご紹介したいと思います。
現職で導入支援しているHubspotやIntegromatについての記事も執筆予定なので興味のある方はぜひユーザーフォローしてください。

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1