LINEBot-kit

A micro service for line bot

Richmenu: https://events.line.me/tw/lineat/minisite/wp-content/themes/line/download.php
Reply: https://medium.com/pyradise/使用node-js建置你的第一個line-bot-590b7ba7a28a
Push message: https://www.oxxostudio.tw/articles/201806/line-push-message.html

Folder tree

|--routes
|    |--line_bot
|    |      |--index.js
|    |      |--handlers
|    |      |     |--linewebhook.js
|    |      |     |--push_message.js          
|--.env
|--.gitlab-ci.yml
|--app.js
|--Dockerfile
|--package.json
|--package-loac.json
|--readme.md

Environment setting

1. Using ssh and enter to the new environment:
    - sudo apt-get update
    - sudo apt install docker.io
2. Pull the newest version of Docker image and run it , check it's the service online
    - docker login registry.example.com -u {username} -p {access-token}  
    - docker pull registry.gitlab.com/asiabots/wilson/line_bot_api
    - sudo docker run -d -p 80:80 registry.gitlab.com/asiabots/wilson/line_bot_api
    - docker logs docker_container_id
3. Install ngrok for https access
    - sudo apt-get install unzip wget
    - wget https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip
    - unzip ./ngrok-stable-linux-amd64.zip
    - ./ngrok authtoken eGbiR4ue13atmuk1Gd78_5LSVKDJGMQA3soA4wzPAb    
4. Auto setting
    - cd /usr/sbin
    - sudo touch api.sh
    - sudo chown root:root api.sh
    - sudo chmod +x api.sh
    - sudo nano api.sh
      code in api.sh:
          - cd /home/$USER
          - sudo docker run -d -p 80:80 registry.gitlab.com/asiabots/wilson/line_bot_api
          - sudo ngrok http 80
    - crontab -e
        - @reboot /usr/sbin/api.sh
 5. LINEBot setting
    - Create a new LINEBot and copy the channelID, secret and access token
    - Enter status, copy the httpsurl, paste it in LINEBot Webhook URL e.g https://333498e7.ngrok.io/line_bot/linewebhook

LINEBot QR code

LINE Login

1. Open LINE developer,select LINE login service.
2. Modify Login url : https://access.line.me/oauth2/v2.1/authorize?response_type=code&client_id={channel_id}redirect_uri={redirect_url}&scope=openid%20profile&state=abcde
3. Create a LINE login button in your application , which should follow the format.
4. Action of Login button should be the Login url.
5. When user accept login, it will return a access tokem (expire day:30), to let you access user profile, then you can save it into your database.

Message API

Video tutorial

1. create your own line bot and get information : channel id, channel secret, channel access token
2. modify .env file parameter : line_bot_channelid, line_bot_channel_secret, line_bot_channel_access_token
3. run app.js

LINE Rich Menu

** Rich menu only active in mobile version **

1. Create a new rich menu (API 5.)
2. Upload rich menu image (API 7.)
3. Select and active rich menu (API 8.)
PS: The image size should be fix to 2500 * 843 or 2500 * 1686

API list

** Access token is the line bot access token **

1. List all rich menu
   method: GET
   url: https://api.line.me/v2/bot/richmenu/list
   authorization：bearer token
   

2. View the target rich menu
   method: GET
   url：https://api.line.me/v2/bot/richmenu/{rich-menu-id}
   Authorization：Bearer Token

3. View the group of the target rich menu
   method: GET
   url: https://api.line.me/v2/bot/user/all/richmenu
   Authorization：Bearer Token
   

4. Download the target rich menu image
   method: GET
   url: https://api.line.me/v2/bot/richmenu/{rich-menu-id}/content
   Authorization：Bearer Token

5. Delete the rich menu
   method: DELETE
   url：https://api.line.me/v2/bot/richmenu/{rich-menu-id}
   Authorization：Bearer Token

6. Create a new rich menu
   method: POST
   url: https://api.line.me/v2/bot/richmenu
   Authorization：Bearer Token
   Request:
   

{
    "size": {
      "width": 2500,
      "height": 843
    },
    "selected": false,
    "name": "richmenu-demo-1",
    "chatBarText": "LINE圖文選單範例",
    "areas": [
      {
        "bounds": {
          "x": 0,
          "y": 0,
          "width": 833,
          "height": 843
        },
        "action": {
          "type": "message",
          "label": "文字",
          "text": "Hello, World!"
        }
      },
      {
        "bounds": {
          "x": 833,
          "y": 0,
          "width": 833,
          "height": 843
        },
        "action": {
          "type": "uri",
          "label": "網址",
          "uri": "https://medium.com/@augustus0818/line-bot-rich-menu-aa5fa67ac6ae"
        }
      },
      {
        "bounds": {
          "x": 1666,
          "y": 0,
          "width": 833,
          "height": 843
        },
        "action": {
          "type": "location",
          "label": "位置"
        }
      }
   ]
}

Response:

{
    "richMenuId": "richmenu-34bbaca71175643b937ef06739c380b6"
}

7. Update the rich menu image
   method: POST
   url: https://api.line.me/v2/bot/richmenu/{rich-menu-id}/content
   Authorization：Bearer Token
   Content-Type: image/png
   Binary: image.png
   PS: must follow the size of api 5.
   

8. Select the rich menu for all user
   method: POST
   url: https://api.line.me/v2/bot/user/all/richmenu/{rich-menu-id}
   Authorization：Bearer Token
   Response:
   

{}

9.Push message
method: POST
url: http://ec2-54-169-136-238.ap-southeast-1.compute.amazonaws.com/line_bot/push_message
Request:

{
	"userID":"Uc0f456a6fcac97db81a5d4df556f89ff",
	"message":"Yoooooooooooooooooooooo"
}

Response:

{
    "status": true
}