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

#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](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/443381a9-9174-b195-d1fd-902da37da169.png)

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


そのまま即コマンドを試したい方は届いたメールのアクセストークン取得ページに進んで、アクセストークンをコピーで拾ってAPIリファレンスで試すとよい。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/a5cf44d6-7b6f-e06a-1950-fb82c16ab8b3.png)


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

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

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

APIドキュメントのAuthorization Code Flow部分にある通り、
-前述のメールから取得できる**アクセストークン**は**有効期限24時間**
-Webアプリ認証用URLで取得する**認可コード**は**有効期限10分**※後ほど解説
-24時間期限のアクセスコードの代わりに、時間の期限はないが、**一回使い切りのリフレッシュトークン**がある
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/b5cc849c-0047-7230-3db4-9d189085f2b3.png)

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

###具体的に言うとこう
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/80f3f25d-e507-2b31-80eb-21f1471ff425.png)
Content-Type=application/x-www-form-urlencoded
で
https://accounts.secure.freee.co.jp/public_api/token
をURLにセットし、
作成されたアプリ詳細の**基本情報**から*Client ID*と*Client Secret*をセット。
Webアプリ認証用URLをブラウザで開き、認可コードを取得して*code*にセット。
![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/5a286b1e-cfd1-68f7-5037-657e9fca4913.png)

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

こうするとリターンがこうなる
![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/8e51fd68-c7be-874f-222e-bf58a8eb5894.png)

それを受けて、シナリオをこういう風に作り変える
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/b796b436-04af-d407-f184-e0fd1a3126e4.png)

![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/b771de6d-ae31-b342-3663-337f0f5526c5.png)

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

その上でヘッダーに*Authorization= Bearer {{アクセストークン}}*としてAPIを叩く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/e02ed7e9-26af-4d9e-8f42-fcffdec3bc64.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](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/172e84d6-0a76-c346-7ffe-7311012b6272.png)

freeeアプリの設定側で**コールバックURL**を
https://www.integromat.com/oauth/cb/oauth2
に設定し、
※詳細はこちらhttps://www.integromat.com/en/help/app/http
このモジュールのConnection作成時に以下の用に設定すれば、一発でOAuth2.0への道が開けます。
ヘッダーにも何も設定しないでOK!
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1984110/41c60d5e-0827-9a75-54e4-6170750476de.png)
※Client ID とSecretは前述の方法と同様にセットしてね

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