GASでLINE botを無料で開発

# はじめに
以前Discord botを開発したことがあったのですが、LINE botはなく、面白そうなので作りました。
技術記事をこれまで書いたことがなかったので、新しい取り組みとして今回の開発について書いた次第です。

### 何ができるのか
* GASでLINE botを開発
* OpenWeatherMapAPI（天気API）を使い、例えば、雨の日に傘をおき忘れないように通知してくれるbotを作れる

### 対象者

*　GASをあまり知らないが、GASを使って何か開発してみたい方
*　LINE botを作りたい方
*　天気APIを使って何かアプリを開発したい方
*　無料で何かアプリを開発したい方

### 大まかな流れ

1. アカウント登録
1. GASスクリプトを書く
1. テスト

# アカウント登録

### LINE Developersの登録

まず、[LINE Developersアカウント](https://developers.line.biz/ja/)を作る必要があるので、ログインしてください。右上の「コンソールにログイン」を押してください。

こんな画面に遷移すると思うので、緑の「LINEアカウントでログイン」を押してください。

![qiita_line_developers_login.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/4fc88261-c99c-4ca1-81d5-2b7bf3e1be48.png)

ログインしたらこのような画面になると思います。

![qiita_line_admin.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/6423fd99-87f7-447d-b048-733b2a4c09b9.png)


そしたら、「プロバイダー」→「新規チャンネル作成」→「Messaging API」を選択し、新規チャンネル（bot）を作成します。

そしたら、そのチャンネルを選択します。

![qiita_line_admin2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/f243f97a-4f38-4625-ba71-633ebdb37439.png)

この画面に遷移したら、「Messaging API設定」のメニュータブを押します。

下にスクロールすると、画面下部に「チャネルアクセストークン（長期）」と書かれた長い文字列があると思います。

ここまでいけば一旦OKです。後でトークンをコピーするのですが、今はひとまず次の作業に移ります。

:::note alert
このトークンは他人に見せないでください！
:::


### OpenWeatherMapAPIの取得

無料の天気APIはいくつかありますが、今回はOpenWeatherMapAPIを使います。

[OpenWeatherMap](https://openweathermap.org/)にログインします。（アカウントがない場合は登録）

![qiita_owmAPI.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/f303a681-cd2d-49d7-b8f8-58dc33ee3eec.png)

この右上の「My API keys」を押します。そしたら、Keyが表示されていると思います。

ここまで到達したら、ひとまずOKです。

:::note alert
このトークンも他人には見せないようにしましょう！
:::


# GASスクリプティング

**Google Apps Script新規プロジェクト作成**
* Google Drive → 新規 → その他 → Apps Script

![qiita_gas1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/b8bedfff-fc14-4918-bd71-79fdfc1961cc.png)

このような表示が出た場合は「スクリプトを作成」ボタンを押してOKです。

**APIキーなどの設定**

LINEチャンネルのアクセストークンとOpenWeatherMapAPIKeyを書くのですが、GASには`.env`ファイルを作れないので、代わりに`ScriptProperties`というものを使います。

エディタ画面の左側にアイコンが縦に並んだメニュータブがあります。そこの歯車のマークの「Project Settings」とクリックします。

下に画面をスクロールすると、`Script Properties`があるので、そこで宣言をします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/29c70cfa-6ac2-467e-a58c-8a5c66458ec0.png)

宣言したら、エディタ画面に戻ります。

私が書いたコードは以下のとおりです。

```
// 雨かどうかを判定
function checkWeatherAndNotify() {
  const weatherApiKey = getConfig("OPEN_WEATHER_MAP_API_KEY");
  const lat = getConfig("LATITUDE");
  const lon = getConfig("LONGITUDE");
  const weatherUrl = `https://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${lon}&appid=${weatherApiKey}&lang=ja`;

  const response = UrlFetchApp.fetch(weatherUrl);
  const data = JSON.parse(response.getContentText());

  const weatherMain = data.weather[0].main;
  const weatherDesc = data.weather[0].description;

  if (weatherMain === "Rain" || weatherMain === "Drizzle" || weatherMain === "Thunderstorm" || weatherMain === "Snow") {
    sendLineMessage(`今日の天気は「${weatherDesc}」です。傘を忘れていませんか？`);
    Logger.log(`今日の天気は「${weatherDesc}」です。傘を忘れていませんか？`);
  } else {
    sendLineMessage(`今日の天気は「${weatherDesc}」なので通知は送信しません。`);
    Logger.log(`今日の天気は「${weatherDesc}」なので通知は送信しません。`);
  }
}

// LINEに送信
function sendLineMessage(messageText) {
  const lineToken = getConfig("LINE_TOKEN");

  const message = {
    messages: [
      {
        type: "text",
        text: messageText
      }
    ]
  };

  const options = {
    method: "post",
    contentType: "application/json",
    headers: {
      "Authorization": "Bearer " + lineToken
    },
    payload: JSON.stringify(message)
  };

  UrlFetchApp.fetch("https://api.line.me/v2/bot/message/broadcast", options); // "broadcast"はLINE友達全員に送信という意味
}

// APIキーを取得
function getConfig(key) {
  const value = PropertiesService.getScriptProperties().getProperty(key);
  if (!value) throw new Error(`設定「${key}」が見つかりません。`);
  return value;
}
```

:::note warn
`OPEN_WEATHER_MAP_API_KEY`や`LATITUDE`などの名前は`Script Properties`で宣言したキーの名前と同じである必要があります。
:::


![qiita_gas_run.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4030773/53f7fd1d-9b0f-422d-8f4b-bae9d2076e10.png)

コードが書けたら、画面上部の「Run」ボタンを押します。

:::note warn
「Run」ボタンの右にあるプルダウンから実行する関数名を指定する必要があります。
:::

問題なく実行できたら、LINEで通知が来ると思います！