日本語を英訳して返してくれるLineBotを作る【個人開発】

## LINE for Businessの設定

![01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/7839a693-30af-21c0-ae7f-ccd20b49379b.png)
1. `LINE for Business` にアクセスし、 `アカウントの開設（無料）` を押下する
    - アカウントお持ちの方は `ログイン` を押下する
![02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/88e9348d-31a2-4ef1-98eb-c3942f1d6baa.png)
2. `LINE公式アカウント開設（無料）` を押下する
![03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/4e1a87f2-ceab-ef81-bf51-8e8436e03e05.png)
3. `LINE アカウントでログイン` を押下する。（その後の設定省略）
![04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/813a629e-3ed0-888a-2787-77e855627aec.png)
4. `応答モード:` を押下し、 `設定 > 応答設定 > 基本設定` を開く
    - 応答モード を `Bot`に設定
    - Webhook を `オン`に設定
![05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/2183b955-d283-6286-5011-45dac6518f1a.png)
5. `ホーム > トークルーム管理 > あいさつメッセージ` を設定する（※ LINE追加時のメッセージ）
![06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/2dafbae5-322c-6ddb-b476-a467a69830eb.png)
6. `応答モード:` を押下し、 `設定 > Messaging API` の `Messaging APIを利用する` ボタンを押下する
![07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/c49a1bd4-dba5-8b2a-c318-c66f359ae3fb.png)
7. `プロバイダー名` を入力して `同意する` を押下する
![08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/33fca618-4e71-095e-78a9-dc2e7b9a525c.png)
8. `OK` を押下する
![09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/06c35be1-cfb0-74d3-aa94-5d82c13fa2b4.png)
9. `Channel ID` と `Channel secret` が表示されれば成功
10. [LINE Developers](https://developers.line.biz/ja/) にアクセスする

## LINE Developersでチャネルアクセストークンを発行する

![16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/9c801021-4af0-1071-d6e1-a19852d96712.png)
1. `コンソール` を押下する
![17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/9070bfdd-4738-c526-9fb9-6ba9e0ff9ee8.png)
2. `Messaging API設定 > チャネルアクセストークン` の `再発行` ボタンを押下する
    - 初回時は `発行` ボタンを押下する
3. 生成されたチャネルアクセストークンをコピーする

## Apps Scriptでコード作成

※ googleアカウントが必要です。

![18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/d47f1f0d-a93f-6d85-3406-f364124b1a3d.png)
1. `Start Scripting` を押下する
2. googleアカウントにログインする
![11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/df69805d-2ec6-7ac4-1c50-444f36729040.png)
3. `新しいプロジェクト` を押下する
![13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/9fe50589-6702-def5-4397-b0bde3706df3.png)
4. プロジェクト名とファイル名を任意の名前に変更する
    - `プロジェクト名`：`google_translate_api`
    - `ファイル名`：`main.gs`
5. `main.gs（作成したファイル）` を以下のコードに置き換える
    - `【チャネルアクセストークン】` は [LINE Developersでチャネルアクセストークンを発行する](#line-developersでチャネルアクセストークンを発行する) で発行したものを使用する
```gs:main.gs
function doPost(e) {
  var replyToken= JSON.parse(e.postData.contents).events[0].replyToken;
  if (typeof replyToken === 'undefined') {
    return;
  }

  var message = 'メッセージは文章で送ってください。';
  var url = 'https://api.line.me/v2/bot/message/reply';
  var channelToken = '【チャネルアクセストークン】';
  
  var input = JSON.parse(e.postData.contents).events[0].message;
  
  if(input.type == 'text') {
    message = LanguageApp.translate(input.text, 'ja', 'en');
  }

  var messages = [{
    'type': 'text',
    'text': message,
  }];

  UrlFetchApp.fetch(url, {
    'headers': {
      'Content-Type': 'application/json; charset=UTF-8',
      'Authorization': 'Bearer ' + channelToken,
    },
    'method': 'post',
    'payload': JSON.stringify({
      'replyToken': replyToken,
      'messages': messages,
    }),
  });
  return ContentService.createTextOutput(JSON.stringify({'content': 'post ok'})).setMimeType(ContentService.MimeType.JSON);
}
```
![14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/cd215ded-34f0-846e-2ea8-04fe94498a7b.png)
6. `デプロイ > 新しいデプロイ` を押下する
![15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/36e141f9-456a-9fdc-4089-d97148098bfa.png)
7. 以下のように入力し、 `デプロイ` を押下する
- 新しい説明文：`test（任意）`
- 次のユーザとして実行：`自分（メールアドレス）`
- アクセスできるユーザー：`全員`
![20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/a66814fd-cd53-5efb-6494-702b8bc03ee9.png)
8.`URL` をコピーする

## LINE Botテスト

![10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/8b9f2a0d-e281-69a3-3dcf-d8bd8dd4fc81.png)
1. LINE Developers の `Messaging API設定 > チャネルアクセストークン > Webhook URL` にApps ScriptのURLを入力する
![21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/496f1bec-1ed6-0038-5270-5414eb75c497.png)
2. QRコードからLINE Botの登録を行う
![22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/449867/5b09c152-01af-b323-ca68-1e66b128abd9.png)
3. 英訳して返信されたら成功

## GitHub

https://github.com/ryomeblog/qiita/tree/master/%E6%97%A5%E6%9C%AC%E8%AA%9E%E3%82%92%E8%8B%B1%E8%A8%B3%E3%81%97%E3%81%A6%E8%BF%94%E3%81%97%E3%81%A6%E3%81%8F%E3%82%8C%E3%82%8BLineBot%E3%82%92%E4%BD%9C%E3%82%8B

## 参考文献

https://first-contact.jp/blog/article/linebot/