Ngrokを用いた簡単Botテスト作成

# Ngrokを用いた簡単Botテスト作成

## Ngrokって？？？
 **Ngrok**は、localhostで動いているサーバーを、LANの外からアクセスできるようなるものです。
ローカル環境を外部に公開できるため、webhook, callbackなどの受信が必要でも、ローカル環境でその受信が可能となります。
ローカルPC上で稼働しているネットワーク（TCP）サービスを外部公開できるサービスで、ローカルPCのWebサーバを外部公開することができます。

そのため、Botのテスト用にもってこい！ってことなんです。
今の所、読み方は（エヌジーロック）らしいです！

<br>

## インストール方法
  
### Mac用

```sh
$ brew cask install ngrok
```
でダウンロード可能です！



### Windows | Linux用

- [https://ngrok.com/](https://ngrok.com/)
  
上のリンクからダウンロードし、zipを解凍してください。
また、`PATH`を通しておくことをお勧めします
  
<br>

## 起動方法

```sh
$ ngrok http 9000(port番号)
```
<img width="576" alt="ngrok-start.png" src="https://qiita-image-store.s3.amazonaws.com/0/192279/89d012ea-e864-dff4-465b-36c2ba794fc6.png">

<br>
 これで、ローカル環境で立ち上げたポート番号`9000`番を外部からアクセスできるようになります。
 
<br>

## LineBotのテストを実際にNgrokを使って行ってみる

 次にこの**ngrok**を使って、LineBotのオウム返しを実行してみる。  
⚠️ **LineBot**のアカウント作成は以下を参照してください。

- [LINE BOTの作り方を世界一わかりやすく解説（１）【アカウント準備編】](http://qiita.com/yoshizaki_kkgk/items/bd4277d3943200beab26)


## サーバの準備 && Webhookの設定

　上記の方法でLineBotの設定が終わったら、プログラムを準備します。
今回は**golang**で！
<br>

```shell-session:.bashrc
export LINE_CHANNEL_SECRET="Your channnel secret" 
export LINE_CHANNEL_TOKEN="Your channnel token"
export PORT=9000
```

```go:
// オウム返し
package main

import (
        "log"
        "net/http"
        "os"

        "github.com/line/line-bot-sdk-go/linebot"
)

func main() {
        bot, err := linebot.New(
                os.Getenv("LINE_CHANNEL_SECRET"),
                os.Getenv("LINE_CHANNEL_TOKEN"),
        )
        if err != nil {
                log.Fatal(err)
        }

        // Setup HTTP Server for receiving requests from LINE platform
        http.HandleFunc("/callback", func(w http.ResponseWriter, req *http.Request) {
                events, err := bot.ParseRequest(req)
                if err != nil {
                        if err == linebot.ErrInvalidSignature {
                                w.WriteHeader(400)
                        } else {
                                w.WriteHeader(500)
                        }
                        return
                }
                for _, event := range events {
                        if event.Type == linebot.EventTypeMessage {
                                switch message := event.Message.(type) {
                                case *linebot.TextMessage:
                                        if _, err = bot.ReplyMessage(event.ReplyToken, linebot.NewTextMessage(message.Text)).Do(); err != nil {
                                                log.Print(err)
                                        }
                                }
                        }
                }
        })
        if err := http.ListenAndServe(":"+os.Getenv("PORT"), nil); err != nil {
                log.Fatal(err)
        }
}
```

というものを準備します。 PORT番号は9000番です。  

準備ができたら、**ngrok**を起動して、LineBotの**Webhook**の設定をしましょう。  

今回実行すると、先ほど同様以下が出ます

<img width="500" alt="ngrok_https.png" src="https://qiita-image-store.s3.amazonaws.com/0/192279/48f76834-b403-e460-ed0c-7b773b308544.png">


<br>

それの一番下のURLをコピーし、先ほど示した、Webhook URLのところに、ngrokのURL + "/callback"として追加します。

<br>

<img width="829" alt="webhook_callback.png" src="https://qiita-image-store.s3.amazonaws.com/0/192279/4b3338a4-bcba-d0c4-a6ea-8a7665599e32.png">


<br>


これで準備が完了したので実行して見ます。  

<br>

![callback.gif](https://qiita-image-store.s3.amazonaws.com/0/192279/0de2b293-40bc-42dd-8153-76870d740acb.gif)



## 最後に

**Ngrok**を用いればBotの試運転等に最適であると思うので、是非皆さんも試して見てください！  
 <br>