【LINE bot에서 이미지 전송하는 방법】 물어 보면 시바의 이미지를 반환하는 LINE bot을 만들어 보았습니다.
개요
LINE bot으로 할 수 있는 것을 조사하고 있으면, 이미지를 돌려주는 것이 가능하다는 것으로 시험해 보았습니다.
단지 이미지를 돌려주는 것만으로는 재미있지 않기 때문에, 시바견 API로 이미지를 주워 와서 표시하기로 했습니다. 마지막으로 소스 코드의 전체를 싣고 있습니다.
Shiba Inu API는 여기을 참조하십시오. 실제 움직임은 다음과 같습니다.
【데모】
LINE bot은 이미지를 반환하는 기능도 있습니다! 그렇다면 물어보면 시바견의 이미지를 돌려주는 LINE bot을 만들어 보았습니다 🐶 #protoout 피 c. 라고 r. 코 m / H Hunfu QvcfR — 마에푸
구성
주요 구성은 다음과 같습니다. LINE bot에서 텍스트를 보내면 로컬의 Node.js 서버에 Webhook이 던져지고 LINE Messaging API의 형식에 따라 이미지 URL이 반환됩니다.
만들어 보자
개발 환경
OS: Windows 10
Node.js: v10.15.3
[라이브러리 버전]
@line/bot-sdk:6.8.4
express: 4.17.1
axios: 0.19.2
프로그램 해설
프로그램의 전체는 마지막에 올려놓는다고 여기에서는 중요한 곳만 해설합니다.
LINE bot의 서버에서 이미지를 반환하는 형식은 다음과 같습니다.
return client.replyMessage(event.replyToken, {
type: 'image',
originalContentUrl: 'オリジナルサイズの画像URL',
previewImageUrl: 'LINEアプリのトーク画面にプレビューされるサイズの画像URL'
});
이미지 URL을 지정하려면 Google 드라이브 및 Dropbox와 같은 저장용량을 사용해야 합니다.
또, 사용할 수 있는 화상 사이즈에 한계가 있는 것 같습니다. 자세한 내용은 
LINE Developer 사이트를 참조하십시오.
이번 예에서는 시바견 APi를 이용하여 얻은 이미지 URL을 다음과 같이 고정으로 입력하고 있습니다.
return client.replyMessage(event.replyToken, {
type: 'image',
originalContentUrl: 'https://cdn.shibe.online/shibes/907fed97467e36f3075211872d98f407398126c4.jpg',
previewImageUrl: 'https://cdn.shibe.online/shibes/907fed97467e36f3075211872d98f407398126c4.jpg'
});
여담
여기까지 이르기까지 고생했습니다(;'∀')
왠지 이미지를 보낼 수 없어-와 여러가지 고민하고 있어 결국은 Discord의 여기의 기술 질문 채널에 던졌습니다. 기쁘게도 2기생 쪽이 동작 확인해 잘못 개소를 가르쳐 주셨습니다. 정말 고마워요.
결국은 돌려주는 포맷이 잘못되어 주셨다니...... 다음부터는 제대로 사양을 읽고 이해하면!
라고 말하면 이미지를 보낼 수 있었습니다. 다음은 자택에서 가동하고 있는 채소밭 관리 시스템과 연결해, 화상을 일정 시간 마다 보낼 수 있도록 해 나가려고 생각합니다.
참고
소스 코드
'use strict';
const axios = require('axios'); // 追加
const express = require('express');
const line = require('@line/bot-sdk');
const PORT = process.env.PORT || 3000;
const config = {
channelSecret: 'LINE botのチャンネルシークレット',
channelAccessToken: 'LINE botのアクセストークン'
};
const app = express();
app.get('/', (req, res) => res.send('Hello LINE BOT!(GET)')); //ブラウザ確認用(無くても問題ない)
app.post('/webhook', line.middleware(config), (req, res) => {
console.log(req.body.events);
//ここのif文はdeveloper consoleの"接続確認"用なので後で削除して問題ないです。
if(req.body.events[0].replyToken === '00000000000000000000000000000000' && req.body.events[1].replyToken === 'ffffffffffffffffffffffffffffffff'){
res.send('Hello LINE BOT!(POST)');
console.log('疎通確認用');
return;
}
Promise
.all(req.body.events.map(handleEvent))
.then((result) => res.json(result));
});
const client = new line.Client(config);
function handleEvent(event) {
if (event.type !== 'message' || event.message.type !== 'text') {
return Promise.resolve(null);
}
return client.replyMessage(event.replyToken, {
type: 'image',
originalContentUrl: 'https://cdn.shibe.online/shibes/907fed97467e36f3075211872d98f407398126c4.jpg',
previewImageUrl: 'https://cdn.shibe.online/shibes/907fed97467e36f3075211872d98f407398126c4.jpg'
});
}
app.listen(PORT);
console.log(`Server running at ${PORT}`);
Reference
이 문제에 관하여(【LINE bot에서 이미지 전송하는 방법】 물어 보면 시바의 이미지를 반환하는 LINE bot을 만들어 보았습니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/kmaepu/items/fe718d6fd57929dd6e36
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
'use strict';
const axios = require('axios'); // 追加
const express = require('express');
const line = require('@line/bot-sdk');
const PORT = process.env.PORT || 3000;
const config = {
channelSecret: 'LINE botのチャンネルシークレット',
channelAccessToken: 'LINE botのアクセストークン'
};
const app = express();
app.get('/', (req, res) => res.send('Hello LINE BOT!(GET)')); //ブラウザ確認用(無くても問題ない)
app.post('/webhook', line.middleware(config), (req, res) => {
console.log(req.body.events);
//ここのif文はdeveloper consoleの"接続確認"用なので後で削除して問題ないです。
if(req.body.events[0].replyToken === '00000000000000000000000000000000' && req.body.events[1].replyToken === 'ffffffffffffffffffffffffffffffff'){
res.send('Hello LINE BOT!(POST)');
console.log('疎通確認用');
return;
}
Promise
.all(req.body.events.map(handleEvent))
.then((result) => res.json(result));
});
const client = new line.Client(config);
function handleEvent(event) {
if (event.type !== 'message' || event.message.type !== 'text') {
return Promise.resolve(null);
}
return client.replyMessage(event.replyToken, {
type: 'image',
originalContentUrl: 'https://cdn.shibe.online/shibes/907fed97467e36f3075211872d98f407398126c4.jpg',
previewImageUrl: 'https://cdn.shibe.online/shibes/907fed97467e36f3075211872d98f407398126c4.jpg'
});
}
app.listen(PORT);
console.log(`Server running at ${PORT}`);
Reference
이 문제에 관하여(【LINE bot에서 이미지 전송하는 방법】 물어 보면 시바의 이미지를 반환하는 LINE bot을 만들어 보았습니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/kmaepu/items/fe718d6fd57929dd6e36텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
