用Line機器人上傳imgur圖片教學(Express,@line/bot-sdk)

目標想達到的效果

閱讀前需具備知識

• Line機器人創建設置
• Nodejs與express基礎配置
• @line/bot-sdkSDK的基本認知

步驟說明

收到line機器人訊息取得圖片訊息ID

{
  "destination": "xxxxxxxxxx",
  "events": [
    {
      "type": "message",
      "message": {
        "type": "image",
        "id": "354718705033693859",
        "contentProvider": {
          "type": "line"
        },
        "imageSet": {
          "id": "xxxxxxxxxx",
          "index": 1,
          "total": 2
        }
      },
      "timestamp": xxxxxxxxxx,
      "source": {
        "type": "user",
        "userId": "xxxxxxxxxx"
      },
      "webhookEventId": "xxxxxxxxxx",
      "deliveryContext": {
        "isRedelivery": false
      },
      "replyToken":  "xxxxxxxxxx",
      "mode": "active"
    }
  ]
}

使用Line API取得圖片訊息內容

const line = require('@line/bot-sdk');

const client = new line.Client({
  channelAccessToken: '<channel access token>'
})
client.getMessageContent('<messageId>')
  .then((stream) => {
    stream.on('data', (chunk) => {
      ...
    });
    stream.on('error', (err) => {
      // error handling
    })
  })

處理buffer資料

• 把buffer搜集起來

const buffers = []
readableBuffer.on('data', chunk => {
  buffers.push(chunk)
})

• 結束時將資料轉換成stream的格式

const { Readable } = require('stream')
readableBuffer.on('end', async () => {
  const stream = Readable.from(buffers)
})

使用imgur API上傳

const imgur_client = require('../imgur/index')
const data = await imgur_client.upload({
  image: stream,
  type: 'stream',
  album: process.env.IMGUR_ALBUM_ID
})
const link = data.data.link