【GAS & LINEWORKS】最寄駅を検索してくれる Bot を作ってみた

気づいたら異世界に召喚されていて見覚えのない場所に・・・なんて、よくある話ですよね！

お酒飲んだときに、気持ちよくなってお星さまを眺めてたらあっという間に朝になり、いつの間にか見知らぬ土地にワープさせられれてたり。
ちょっと気になる路地裏を見つけてふらりと入り込んでみたら、異界の街に辿り着いて帰り道がわからなくなったり。
ふと知らぬ駅に降りてみたら、お猫様が「ついてこいよ（イケメソ）」ってしっぽを振ってたからついていったら、たくさんのお猫様に囲まれて帰れなくなったり。

よくある話ですよね！(*‘∀‘)

そんなとき、妖精さん（Bot）に現在位置を送れば最寄駅の情報を教えてもらえるなら安心ですよねー。

ってなわけで、作ってみましたので紹介したいと思いまーす

# どんな仕組み？

LINEWORKS のトーク画面から Bot に位置情報を送信すると、緯度経度から最寄りの駅を検索して教えてくれます。それだけ！

### 実際の画面

<img width="360" alt="ss1" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/363367/d9984af5-68d1-d5b0-3a6d-572790beccfa.png">

### 利用した技術

- [Google Apps Script (GAS)](https://developers.google.com/apps-script)
- [LINEWORKS トーク Bot API](https://developers.worksmobile.com/jp/document/3005001?lang=ja)
- [HeartRails Express API](http://express.heartrails.com/api.html)

GAS は本当に便利。
LINEWORKS もトーク Bot は無料で使えるからとても便利。

HeartRails Express API は今回初めて使いました。
緯度経度から最寄り駅検索できるとか珍しい API があったので！
特に登録とかも必要なく、URL 叩けばデータをくれるのでとても使いやすかったです。

## Bot を登録して使ってみる！

私が提供している GoogleAppsScripts のライブラリを使用して簡単に Bot を実装できるようにしました！

ってなわけで、使ってみたい方はまずは LINEWORKS ライブラリを GoogleAppsScripts に登録してくださいませ。

### LINEWORKS ライブラリを登録する

|ライブラリ名|スクリプト ID|
|-----------------|------------------|
|LINEWORKS|1aLcCr3CWqfenPMyM0_FWIDUgRcTxsit9bO6BTx61NCXrCtkY2zbHBlod|

1. GoogleAppsScripts 画面上部の「リソース」-「ライブラリ」をクリック
2. [Add a library] の欄に 1aLcCr3CWqfenPMyM0_FWIDUgRcTxsit9bO6BTx61NCXrCtkY2zbHBlod を入力して追加ボタンをクリック
3. 「LINEWORKS」ライブラリが追加されるので、一番新しいバージョンを選んで保存ボタンをクリック

登録できたらコードを書いていきます。

### GoogleAppsScripts にコードを書く

以下、コピペしてくださいな。

```js:app.gs
const obj = {
  "apiId" : "xxxxxxxxxx",
  "consumerKey" : "xxxxxxxxxxxxxxxx",
  "serverId" : "xxxxxxxxxxxxxxxxxxxxx",
  "privateKey" : "-----BEGIN PRIVATE KEY-----\nxxxxxxxxxxxxxxxxxxxxxxxxxxxx\n-----END PRIVATE KEY-----",
  "botNo" : null
};

const adminId = "xxx@yyy-zzz";
const domainId = xxxxxxxx;
const callbackURL = "https://script.google.com/macros/s/xxxxxxxxxxxxxxxxxxxxxxx/exec"

function regBot(){ LINEWORKS.regFindTheNearestStationBot(obj, adminId, domainId, )}

function doPost(e) {
  if (e == null || e.postData == null || e.postData.contents == null) return;
  const requestObj = JSON.parse(e.postData.contents);
  const accountId = requestObj.source.accountId;
  const x = requestObj.content.longitude// 経度
  const y = requestObj.content.latitude;// 緯度
  
  // HeartRails Express API
  // http://express.heartrails.com/api.html
  const uri = "http://express.heartrails.com/api/json?method=getStations&x=" + x + "&y=" + y;
  const options = { "method": "get" };
  const stations = JSON.parse(UrlFetchApp.fetch(uri, options)).response.station;
  stations.forEach( station => { LINEWORKS.sendMsg(obj, accountId, station["line"] + station["name"] + "駅まで" + station["distance"])});
  
  const items = [{"action":{ "type": "location", "label": "位置情報を送信" }}];
  LINEWORKS.sendQuickReplyMsg(obj, accountId, "位置情報を送信すると最寄駅を検索します", items);
}
```

以下の部分を自分の情報に書き換えます。
apiId などの LINEWORKS の情報は [Developer Console](https://developers.worksmobile.com/jp/console/) で確認します。

|変数名||
|-----------------|------------------|
|apiId|Developer Console で API ID を確認|
|consumerKey|Developer Console で Server API Consumer Key を確認|
|serverId|Developer Console で Server List(ID登録タイプ)の ID を確認|
|privateKey|Developer Console で Server List(ID登録タイプ)の認証キーを確認<br>（"-----BEGIN PRIVATE KEY-----\nMIIEvAIBADANBgkqhkiG9...\n-----END PRIVATE KEY-----" となるように \n と \n の間に認証キーを入れて一行で表記します）|
|botNo|あとで記入します。今は null のまま|
|adminId|LINEWORKS の管理者権限を持つユーザ ID|
|callbackURL|GoogleAppsScripts の「現在のウェブ アプリケーションの URL」を確認<br>（取得方法がわからない方は[こちら](https://qiita.com/kunihiros/items/a94221ad7c9f4de84cf8#5-%E3%82%B3%E3%83%BC%E3%83%89%E3%82%92%E5%85%AC%E9%96%8B%E3%81%99%E3%82%8B)を参照してください）|

なお、LINEWORKS なんて初めて使うからわかんないよ！という方は[公式](https://developers.worksmobile.com/jp/document/300130001)をご確認いただくか、もしくはこちらの方の記事がわかりやすいと思います。
[LINE WORKSで初めてのBot開発！(前編)](https://qiita.com/tokotan/items/f615f4a62219d655436f)

### Bot を登録する

準備ができたら、GoogleAppsScripts 画面の上部にある「関数を選択」をクリックして `regBot` を選択し、隣の▶ボタンを押して実行します。

すると、LINEWORKS にトーク画面に登録が完了した旨のトークが届きます。
![1594277788.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/363367/09771235-2fcd-dcb9-fd81-acd12784d099.png)

ここで表示された botNo を先ほどスルーした変数 `botNo` に設定します。

設定したら画面上部メニューの [公開] - [ウェブアプリケーションとして導入] から、もう一度 Script を公開して完了です。
このとき、バージョンを `NEW` にするの、忘れないでくださいね～(*‘∀‘)

### 位置情報を送信！

位置情報を送信ボタンを押すと、地図画面に切り替わります。
![1594278218.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/363367/8c1c036c-14ba-ed6e-4366-59b1d4bd8abe.png)

<img width="360" alt="ss2" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/363367/4da7ede5-e85f-4778-77f0-c3adc492393e.jpeg">

真ん中の `地図を添付 >` を押すと位置情報が送信されて最寄り駅の情報が送られてきます。

<img width="360" alt="ss1" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/363367/d9984af5-68d1-d5b0-3a6d-572790beccfa.png">

これで完成です！

#おわりに
ここまでお付き合いいただきありがとうございました。
LINE Bot で作ってる方がいたので見ながら作ってみました。

いやー、やっぱり動くもの作るのは楽しいですね～♪
位置情報を拾えるって面白いですよね。
迷子もそうですけど、落とし物拾った場所とか記録できますもんね。
何か面白い使い方ないかな～。

今回の Bot のためにライブラリに[クイックリプライ](https://developers.worksmobile.com/jp/document/100500807?lang=ja)を追加してみました。
`LINEWORKS.sendQuickReplyMsg`

クイックリプライは便利なので今後も使っていこうと思います！

そう言えば Bot のアイコン LINEWORKS の公式の使っているのですが、何か味気ないですよね・・・種類が増えてきたからなおさらそう感じます。
自分で作れれば良いのですが、私のアイコンの通りの画力なので。。。誰か作ってくれるナイスガイがいらっしゃったら連絡いただけると大喜びしますｗ

次は何を書こうかな～。ではまた！(^^)/

#参考にさせていただきましたm(_ _)m
[GoogleAppsScript 公式サイト](https://developers.google.com/apps-script/reference/)
[LINEWORKS Developers](https://developers.worksmobile.com/jp/document?lang=ja)
[HeartRails Express API](http://express.heartrails.com/api.html)

[【LINE bot】最寄駅検索bot](https://qiita.com/4geru/items/30fa69c65e9fcdd12108)
[LINE WORKSで初めてのBot開発！(前編)](https://qiita.com/tokotan/items/f615f4a62219d655436f)