以前こんなツイートしたので、今回は3個目を紹介します!
Slackの通知方法はちょっと調べたらいっぱい見つかるので、
今回はLINEへリッチに通知させる方法を紹介します!
LINEに通知させる方法もちょっと調べたら方法は見つかりますが、
リッチに通知させることにこだわりました!
こんな感じで動作します。
このようなメール内容をLINEに通知させてみます。
こんな感じにLINEに通知されます!
それでは詳細を解説していきます!
ちなみにツイート内の1個目のネタははこちらです。
2個目の『スプレッドシートの内容をSlackに通知』はこちらです。
【GAS】コードを追加する
追加するコードは2つあります。
- Gmailを検索して、LINEに通知する処理
- メールを表示させるhtml
コードの追加方法は過去の記事を参考にしてください。
【コードの説明①】Gmailを検索する処理
指定の検索条件でメールを検索
// Gmailの検索条件を指定
const searchGmail = "検索条件";
検索条件はGmailで検索する文字と同じ動作をします。
通知したメールにはスターを付けるために、検索条件には” -is:starred”を追加しており、
スターが付いていないメールを検索する処理となっています。
// 検索条件に「-is:starred」を追加して、1スレッドのみ検索
const threads = GmailApp.search(searchGmail + " -is:starred", 0, 1);
検索したメールを1件ずつ処理
// 検索されたメッセージを1件ずつ処理
for (let thd in messages) {
for (let mail in messages[thd]) {
let maiID = messages[thd][mail].getId(); // メールIDを取得
let mailFrom = /"(.*?)"/.exec(messages[thd][mail].getFrom())[1]; // メールの宛名を取得
let mailSubject = messages[thd][mail].getSubject(); // メールの件名を取得
// メールデータをキャッシュに書き込む
let cache = CacheService.getScriptCache();
cache.put("mailBody" + maiID, messages[thd][mail].getBody(), 21600);
// LINEに通知する
pushMessage(maiID, mailFrom, mailSubject);
// メールにスターを付ける
messages[thd][mail].star();
}
}
スレッドに存在するメール1件ごとに以下の処理を行います。
- メールIDを取得する
- メールの宛名を取得する
- メールの件名を取得する
- メールデータをキャシュに書き込む
- キー名を『mailBody + メールID』で保存することで各メールを保存しています。
- メールデータをLINEに送る処理に渡す
- メールにスターを付ける
【コードの説明②】LINEに送る処理
過去の記事でも紹介した『LINEでURIアクション』を送信する処理を使っています。
const payload = {
to: To,
messages: [
{
type: "template",
altText: from.substr(0, 29) + "からメールがありました", // 40文字制限があるため、文字制限している
template: {
type: "buttons",
title: from.substr(0, 29) + "からメールがありました", // 40文字制限があるため、文字制限している
text: subject.substr(0, 60), // 60文字制限があるため、文字制限している
actions: [
{
type: "uri",
label: "メールの詳細はこちら",
uri: appURL + "?mailID=" + id,
altUri: {
desktop: appURL + "?mailID=" + id,
},
},
],
},
},
],
【コードの説明③】メールを表示させる処理
ここがちょっと苦戦しました。。。
コードはこちらです。
/*
関数概要
LINEの「メールの詳細はこちら」をタップしたら呼び出される関数
メールIDから各メールのhtmlデータをキャッシュから呼び出して
表示用のキャッシュに一時的に書き込みます
引数
e イベントオブジェクト(起動時の情報が含まれています)
戻り値
メールが書かれているhtmlを返す
*/
function doGet(e) {
// パラメータからメールIDを取り出す
const ID = e.parameter.mailID;
// "mailBody"+IDのhtmlデータをキャシュから取り出す
const cache = CacheService.getScriptCache();
const mailBody = cache.get("mailBody" + ID);
// 取り出したキャッシュを一時的に"mailBody"に書き込む
cache.put("mailBody", mailBody, 21600);
// サイズを調整して、htmlを返す
return HtmlService.createHtmlOutputFromFile("index").addMetaTag(
"viewport",
"width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=10.0"
);
}
/*
関数概要
表示用のキャッシュを取得します
引数
なし
戻り値
"mailBody"のhtmlデータを返す
*/
function getMailBody() {
const cache = CacheService.getScriptCache();
return cache.get("mailBody");
}
メールごとに保存してあるキャッシュを切り替えることで、各メールのhtmlを表示させています。
イメージはこんな感じです!
GASのhtml操作はこちらを参考にしました!
【LINE】トークンを取得する
取得方法は過去記事を参考にしてください!
取得したトークンはコードのLINEのトークンと差し替えてください。
// LINEで取得したトークン
const token = "LINEのトークン";
【LINE】userIDを取得する
取得方法は過去記事を参考にしてください!
取得したユーザーIDはコードのLINEの送信するユーザーIDと差し替えてください。
// LINEで送信する宛先
const To = "LINEの送信するユーザーID";
【GAS】公開URLを取得する
取得方法は過去記事を参考にしてください!
取得したURLはコードのGASの公開URLと差し替えてください。
// GASの公開URL
const appURL = "GASの公開URL";
【GAS】トリガーを設定する
設定方法は過去記事を参考にしてください!
設定のサンプルはこんな感じです。
【実行結果】LINEでメールを表示させてみた
特定メールは以下のメール内容としてみます。
LINEに通知されたらこんな感じになります!
まとめ
パラメータによってhtmlを切り替える処理は他にも使えそう。
また、今回初めてGASのキャッシュを使ってみました。
これも使えそうだ。
コメント