2018/04/01 ブログのテーマをcocoonに変更しました。

【GAS】クックパッドのレシピを返信してくれるLINE Botを作ってみた。

当ブログの読者様から、リクエストがありましたので作ってみましたー。

 

いつもブログで勉強させていただいてます!(初心者でもできるように解説してくれているのが。とてもありがたいです)クックパッドレシピをLineBotで返す方法を模索しているのですが、なかなかうまくいかず。。。ぜひブログを書いていただけると嬉しいです!

 


オーカワ
前作った晩飯botのLINE版やな

作る機能

  • 材料名などを送信したら、レシピを返信する

以上です。

おさらい

晩飯Bot

当ブログでは、以前にクックパッドのレシピを返信する晩飯Botを作ってきました。

TwitterのBotですが、LINEにも簡単に応用出来ます。

【GAS】Google Apps Scriptで作るTwitter Bot(晩飯 Bot)
いつも当ブログを見ていただいてる読者様からこんなリクエストがありました!! 実際に作っていこうと思います!! 作る機能 Twitterからのリクエストなので、Twitterのbotを作っていきます。 ...

LINE Bot

また、LINE Botも作っていました。今回はこちらの記事で作成したプログラムをベースに作っていきたいと思います。

もし、今回と同じ機能を作る方は一読してくださいね。

[GAS]全米が泣いた親不孝 LINE Botを作ってみた
どーも最近反抗期のオーカワ(@okawa_compass)です。以前親に生存確認を送るBOTを作りました。 IFTTTとLINE Notiftを使い、毎朝8:00に元気ですと送信するBOTでした。 まぁ速攻でバレたんです...

結果(文字のみ)

まず初めにテストとして、今まで作ったプログラムをつなぎ合わせただけの雑な仕事をしました。


オーカワ
作り始めて10分で出来たよ

手抜き感

これでも要件は満たしている気もします。手抜きをしすぎ

少し面白みが足りないです。

 

一応プログラムも

プログラム

var CHANNEL_ACCESS_TOKEN = "ここにチャンネルアクセストークンを";
//webhook_urlから送られた場合
function doPost(e) {
var reply_token= JSON.parse(e.postData.contents).events[0].replyToken;
//きたメッセージを取得
var user_message = JSON.parse(e.postData.contents).events[0].message.text;
var mes = search(user_message);
var url = 'https://api.line.me/v2/bot/message/reply';
UrlFetchApp.fetch(url, {
'headers': {
'Content-Type': 'application/json; charset=UTF-8',
'Authorization': 'Bearer ' + CHANNEL_ACCESS_TOKEN,
},
'method': 'post',
'payload': JSON.stringify({
'replyToken': reply_token,
'messages': [{
'type': 'text',
'text': mes,
}],
}),
});
return ContentService.createTextOutput(JSON.stringify({'content': 'post ok'})).setMimeType(ContentService.MimeType.JSON);
}
function search(mes){
//エラー処理
try{
var response = UrlFetchApp.fetch("https://cookpad.com/search/" + mes);
}
catch(e){//エラーが出たら
return "検索エラー(コンパス 調べたい材料でお願いします。)";
}
//cookpadのtrack_ctの中身を取得
var myRegexp = /<a class=\"recipe-title font13([\s\S]*?)<\/a>/gi;
var url_and_title = response.getContentText().match(myRegexp);
//検索結果
if (url_and_title != null){
url_and_title = url_and_title[0];
}
else{//なかったら
return "一致するレシピが見つかりませんでした。";
}
//Logger.log(url_and_title);
//url取得
myRegexp = /href=\"([\s\S]*?)\"/g;
var url = url_and_title.match(myRegexp);
url = url[0].substr(5);
url = url.replace(/\"/g,"");
url = 'https://cookpad.com' + url;
//Logger.log(url);
//タイトル取得
myRegexp = /\">([\s\S]*?)<\/a>/g;
var title = url_and_title.match(myRegexp);
title = title[0];
//文字列削除
title = title.substr(2);
title = title.substr( 0, title.length-4 );
//作成したメッセージをFormular_botに返す
var meseage = 'こんなのどうでしょう?' + '【' + title + '】' + url;
return meseage;  
}

本当に自分の昔のプログラムをコピペして、少しだけ修正しただけのプログラムです。

過去記事をあさればわかると思います(笑)。

結果(本命)

LINEの公式のドキュメントで探してみまして、表示をなんかそれっぽくしてみました(笑)。

ドキュメント

やはり、公式のドキュメントが一番ですな。

LINEのBotはLINEのサーバーに決められたデータ形式(JSON形式)で送るだけなので、公式にGASのサボートがなくても、作れます。

 

ただスマホだけでしか見られないという欠点がありますが......

メニューを最大5個まで表示してくれます。

プログラム

殴り書きのプログラムですが、しっかりと動きます。コードが汚い箇所は申し訳ございません。もっと少なく書ける気がする(小声)

var CHANNEL_ACCESS_TOKEN = "ここにチャンネルアクセストークンを";
var mes = search(user_message); //cookpadから検索結果を表示
if (mes == "null") {//検索結果がなかったら終了
return;
}
var line_json = [];
for (i = 0; i < mes[0].length; i++){
//自動でメニューを作成
var fuck = (
{
"thumbnailImageUrl": mes[2][i],
"title": mes[0][i],
"text": mes[3][i],
"actions": [
{
"type": "uri",
"label": "詳しいレシピはこちら",
"uri": mes[1][i]
}
]
}
);
line_json.push(fuck);
}
var url = 'https://api.line.me/v2/bot/message/reply';//リプライのurl
UrlFetchApp.fetch(url, {
'headers': {
'Content-Type': 'application/json; charset=UTF-8',
'Authorization': 'Bearer ' + CHANNEL_ACCESS_TOKEN,
},
'method': 'post',
'payload': JSON.stringify({
'replyToken': reply_token,
'messages': [{       
"type": "template",
"altText": "this is a carousel template",
"template": {
"type": "carousel",
"columns": line_json
}
}],
}),
});
return ContentService.createTextOutput(JSON.stringify({'content': 'post ok'})).setMimeType(ContentService.MimeType.JSON);
}
function search(mes){
//エラー処理
try{
var response = UrlFetchApp.fetch("https://cookpad.com/search/" + mes);
}
catch(e){//エラーが出たら
return "null";
}
var title_list = [];
var url_list = [];
var img_url_list = [];
var description_list = [];
//urlとタイトルが入ってるDOM要素を取得
var myRegexp = /<a class=\"recipe-title font13([\s\S]*?)<\/a>/gi;
var url_and_title = response.getContentText().match(myRegexp);
if (url_and_title != null) { //検索結果があったら
number = url_and_title.length; //検索結果数を取得
if (number >=5) number = 5; //検索結果は上から5個までに   
}
else{//なかったら
return "null";
}
for (i = 0; i < number; i++){ //最大5個までurl,title,img_urlを取得
//url取得
myRegexp = /href=\"([\s\S]*?)\"/g;
var url = url_and_title[i].match(myRegexp);
url = url[0].substr(5);
url = url.replace(/\"/g,"");
url = 'https://cookpad.com' + url;
//Logger.log(url);
url_list.push(url);
//タイトル取得
myRegexp = /\">([\s\S]*?)<\/a>/g;
var title = url_and_title[i].match(myRegexp);
title = title[0];
title = title.substr(2);
title = title.substr( 0, title.length-4 );
//Logger.log(title);
title_list.push(title);
//imgのurlを取得する正規表現
//アクセス制限が怖い場合(とりあえず放置)
//var myRegexp2 = /https:\/\/img.cpcdn.com\/recipes\/(\d+)\/100x141c\/([\s\S]*?).jpg/gi;
//var img_url = response.getContentText().match(myRegexp2);
//Logger.log(img_url[i]);
//アクセス制限が怖くない場合
var response2 = UrlFetchApp.fetch(url);
var myRegexp2 = /https:\/\/img.cpcdn.com\/recipes\/(\d+)\/m\/([\s\S]*?).jpg/gi;
var img_url = response2.getContentText().match(myRegexp2);
img_url_list.push(img_url[0]);
//投稿者名
var myRegexp3 = /recipe_author_name([\s\S]*?)<\/a>/gi;
var description = response2.getContentText().match(myRegexp3);
var myRegexp4 = />([\s\S]*?)</gi;
description = description[0].match(myRegexp4);
description = description[0];
description = description.substr( 1, description.length - 2 );
description_list.push("by " + description);
}
//情報を返す
var mes = [];
mes[0] = title_list;
mes[1] = url_list;
mes[2] = img_url_list;
mes[3] = description_list;
return mes;  
}

雑記

晩飯BotのQRコードを公開しようと思いましたが、

もしも晩飯Botが人気になったとしたら、容量制限になる未来が簡単に予想できたので、公開しませんー。

【容量制限】これは困った。GAS(Google Apps Script)の落とし穴
最近GAS(Google Apps Script)にハマっているオーカワ(@okawa_compass)です。 当ブログでも既に2回出ていますね♪GASを使ったプログラムは今後も紹介する予定です。 とても便利なも...

 

もし晩飯Botを友達登録したい方がいましたら、僕宛のTwitterにでも申しつけください。

感想

Twitterで作った時よりも、LINEの方が実用性あると感じました。

LINEはボタンなども作れるので、いろいろと出来ると思います。

ユーザーによって、メニューの表示を変える(人口知能を搭載した)晩飯Botも作れるなど。どっかで見た事あるな

可能性を感じれば感じるほど、やる気が下がるので今回はこの辺でー

コメント