Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
freeeのAPIで作る業務効率化 LINE bot Koki Miura(@k_miura_io)
Slide 2
Slide 2 text
自己紹介 • 三浦 耕生(こうき) • 名古屋のゲーム会社 のサーバーエンジニア @k_miura_io koki.miura05
Slide 3
Slide 3 text
アジェンダ • 今回作ったアプリの紹介 • 使用技術の紹介 • DEMO • アプリ開発のためのTips • ソースコード
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
No content
Slide 6
Slide 6 text
2つの困りごと • 経費精算が大変 • レシートの中身を打ち込むのがめんどくさい • 月の締日にまとめて精算するのではなく忘れないうちにやりたい • 打刻忘れが多い(昔の僕) • 打刻専用のパソコンでやらないとだめ • 忘れたら何故か理由を書かされる(未だに納得できない)
Slide 7
Slide 7 text
これを手元でできれば解決できるのでは?
Slide 8
Slide 8 text
今回作ったアプリ • freeeのAPIを連携した業務効率化する LINE bot • 打刻、打刻修正、経費精算 • レシートの文字起こし(←ポイント) • freeeのAPIトークンを自動更新
Slide 9
Slide 9 text
使用技術 • Python(Flask) • freee API • Messaging API • Clova OCR • IBM Cloud Functions • Cloundant
Slide 10
Slide 10 text
システム構成
Slide 11
Slide 11 text
アプリのメイン機能
Slide 12
Slide 12 text
freeeのAPI • OAuth2認証 • APIトークンの有効期限が短い(24時間) • リフレッシュトークンをつかって工夫をしなければならない (工夫については後ほど紹介) • freeeがWebで提供している各種サービス(労務、会計) の機能をAPIで提供している • プランによって使用できるAPIに制限がある →開発者用の事業所を立てれば全部のAPIが無料で使える ※APIでやるよりもWeb上で設定したほうが早い場合も
Slide 13
Slide 13 text
用途 • 雇用者のID、ユーザ名の取得 • 打刻 • 打刻修正 • 経費申請(APIでは下書きのみ)
Slide 14
Slide 14 text
Clova OCR • 最近リリースした文字起こしサービス • 今回はレシートの画像を送信するとレシート情報を整 理してJSONが返ってくるレシート向けのAPIを使用 • 店舗名(支店名)、購入品目、金額、支払い方法などを きれいにまとめてくれる • よくわからんがしゅごいAPI • コンテスト参加者だけに提供される(無料)!!
Slide 15
Slide 15 text
用途 • ユーザーが撮影したレシートの画像から購入内容を取得 • レシートの内容を立替申請としてfreeeの経費精算APIへ
Slide 16
Slide 16 text
Messaging API • LINE botを動かすために使うAPI • とにかく機能が多い • 無料で使い放題 • ドキュメントめちゃくちゃわかりやすい • 各言語に対応したSDKが提供されている
Slide 17
Slide 17 text
用途 • botのやり取り(メッセージの受信、送信) • ユーザが送った画像データの取得 • リッチメニューの設定、切り替え • 友達追加したときの挨拶 退勤
Slide 18
Slide 18 text
LIFF • LINE Front End Frameworkの略 • LINEアプリ上で開くと自動ログインをする • LINEアプリ上で表示サイズを3つ設定できる (個人的にはTallがおすすめ) • JavaScriptのSDKでユーザ情報を取得する ことができる • LINEのミニアプリの元になる技術
Slide 19
Slide 19 text
用途 • LINEのユーザーIDとfreeeの従業員IDの 紐付け(打刻のAPIを行うときに必要) • 表示しているfreeeのユーザー名ももちろ んAPIから取得 • 友だち追加したときに送信されるメッセージ の中にあるFlexMessageのボタンの中に LIFF URLを仕込んでいる
Slide 20
Slide 20 text
用途その2 • 打刻修正のフォームを用意し日時を入力 • UIが殺風景なのは勘弁してくださいm(_ _)m • 修正ボタンを押すとLIFFを閉じて代わりにbot にメッセージを送信する
Slide 21
Slide 21 text
freeeのトークンを自動更新
Slide 22
Slide 22 text
IBM Cloud Functions • IBM Cloudが提供するサーバーレス環境 • 対応言語が豊富 • クレジットカード無くても使える(無料で使える) • 一定時間に実行するコードを書いたりちょっとしたAPIを 作りたいときに便利
Slide 23
Slide 23 text
用途 • freeeのAPIトークンの有効期限が来る前に12時間おきにトークンを更新 • 取得したトークンとリフレッシュトークンはCloudantへ
Slide 24
Slide 24 text
Cloudant • IBM Cloudで提供されているNoSQLのデータベース • 1GBまで無料 • DBを接続するために認証情報を用意する必要あり →有効期限なし • IBM Cloud Functionsではデフォルトで使えるように SDKがプリインストールされている
Slide 25
Slide 25 text
用途 • APIトークン、リフレッシュトークンの保存(初回のトークンは事前に登 録しておく必要あり) • LINE botのユーザID、freeeの従業員IDの保存 • botのやり取りの保存(ドキュメントのIDにLINEのユーザIDを使用)
Slide 26
Slide 26 text
DEMO
Slide 27
Slide 27 text
いざというときのための動画w
Slide 28
Slide 28 text
アプリ開発のためのTips • 動作検証でAPIを使うときには公式リファレンスにトークンを入れれば試 せる • 会計freeeのAPIであればSDKを使って開発ができる(JavaとC#のみ) • APIトークンは有効期限があることを忘れないように • APIの活用事例はfreeeの開発者ブログでも紹介されている https://developers.freee.co.jp/
Slide 29
Slide 29 text
今回のソースコード https://github.com/Miura55/freee_labor_bot
Slide 30
Slide 30 text
END