Line Messaging API 切换图文选单 Rich Menu

验证码小帮手现在预设的图文选单是获取验证码，可是使用者在身分认证前并不能使用这个功能，也就是说身份认证前後看到的图文选单应该是不同的～

准备不同的 Rich Menu

首先当然是要先建立两个不同的 Rich Menu，这次会用到 Messaging API 去建立图文选单，因为只有使用这种方式建立的 才能用 Messaging API 进行切换。

文件

Creating rich menus with the Messaging API

LINE Bot Designer

这是一个好用的工具～帮助你用图像的方式产生 Rich Menu 需要的 JSON
LINE Bot Designer

使用 LINE Bot Designer，无需任何程序相关知识，即可更快速轻松地设计 LINE 聊天机器人原型，依据所需的场景，自由设计聊天机器人。

尚未执行身份认证时的图文选单

可以得到 JSON 如下：

{
  "size": {
    "width": 2500,
    "height": 843
  },
  "selected": true,
  "name": "bindMailFirst",
  "chatBarText": "身份认证",
  "areas": [
    {
      "bounds": {
        "x": 0,
        "y": 0,
        "width": 1253,
        "height": 843
      },
      "action": {
        "type": "uri",
        "uri": "YOUR_LIFF_APP_URL"
      }
    },
    {
      "bounds": {
        "x": 1254,
        "y": 0,
        "width": 1246,
        "height": 843
      },
      "action": {
        "type": "uri",
        "uri": "YOUR_LIFF_APP_URL/validate"
      }
    }
  ]
}

已执行身份认证时的图文选单

可以得到 JSON 如下：

{
  "size": {
    "width": 2500,
    "height": 843
  },
  "selected": false,
  "name": "获取验证码",
  "chatBarText": "获取验证码",
  "areas": [
    {
      "bounds": {
        "x": 0,
        "y": 0,
        "width": 2499,
        "height": 843
      },
      "action": {
        "type": "message",
        "text": "获取验证码"
      }
    }
  ]
}

Line Messaging API 操作 Rich Menu

文件

Using rich menus

使用 Line Messaging API 建立 Rich Menu

将 LINE Bot Designer 得到的 JSON 用 curl call messaging api：

curl -v -X POST https://api.line.me/v2/bot/richmenu \
-H 'Authorization: Bearer {channel access token}' \
-H 'Content-Type: application/json' \
-d \
{
  "size": {
    "width": 2500,
    "height": 843
  },
  "selected": true,
  "name": "bindMailFirst",
  "chatBarText": "身份认证",
  "areas": [
    {
      "bounds": {
        "x": 0,
        "y": 0,
        "width": 1253,
        "height": 843
      },
      "action": {
        "type": "uri",
        "uri": "YOUR_LIFF_APP_URL"
      }
    },
    {
      "bounds": {
        "x": 1254,
        "y": 0,
        "width": 1246,
        "height": 843
      },
      "action": {
        "type": "uri",
        "uri": "YOUR_LIFF_APP_URL/validate"
      }
    }
  ]
}

可以得到 response 内容为这个图文选单的 id：

{
    "richMenuId": "YOUR_RICH_MENU_ID"
}

如果忘记了也可以使用以下的 API 得到 Rich Menu list (p.s. 只有使用 Messaging API Create 的会出现在此)

curl -v -X GET https://api.line.me/v2/bot/richmenu/list \
-H 'Authorization: Bearer {channel access token}'

上传 Rich Menu 的图片

一样是使用 API 方式上传

curl -v -X POST https://api-data.line.me/v2/bot/richmenu/{richMenuId}/content \
-H "Authorization: Bearer {channel access token}" \
-H "Content-Type: image/jpeg" \
-T image.jpg

将指定的 Rich Menu 设为预设图文选单

curl -v -X POST https://api.line.me/v2/bot/user/all/richmenu/richmenu-88c05ef6921ae53f8b58a25f3a65faf7 \
-H "Authorization: Bearer {channel access token}"

设置特定使用者看到的图文选单

图文选单显示的优先顺序如下(高到低)：

1. The per-user rich menu set with the Messaging API
2. The default rich menu set with the Messaging API
3. The default rich menu set with LINE Official Account Manager

也就是用 API 设定的优先顺序就会是最高的～

一样使用 Messaging API 进行设定

curl -v -X POST https://api.line.me/v2/bot/user/{userId}/richmenu/{richMenuId} \
-H "Authorization: Bearer {channel access token}"

了解这些之後，接下来就可以在我们绑定身份认证码後，同时切换使用者的图文选单，让功能更贴近需求。

昨天把发送认证码的请求送到 GAS 专案，今天则是了解图文选单怎麽进行切换，明天就要继续完成 GAS 专案收到请求後完成绑定身份认证码的功能罗～