QRコードっていろいろできて便利ですよね！
LINEと何か連携できないかと思い作成しました。
2024/12/23追記
2025年3月いっぱいでLINE Notifyのサービス終了が案内されました。
https://notify-bot.line.me/closing-announce
LINE公式アカウントのMessagingAPIを使ったものを
2024年12月23日に記載いたしましたので、よろしければ、こちらをご利用ください。
https://qiita.com/specialman9999/items/4c9c0fb61e990869bf91
(作成は5分でできますので、まずは試してみてください！)
こんな感じで、使えます！
通知メッセージもQRごとに変えられるので、お店の座席番号ごとにQRコードをおいて
〇〇番席呼び出しボタンみたいな感じで、通知が行くようにすれば、超おてがるに呼び出しボタンが設置できます！
では早速やり方を、、、
LINE Notify アクセストークンの取得
LINE NotifyのHPに行きアクセストークンを発行します。
右上のログインボタンからLINEアカウントでログインします。
ログインが完了したら右上に名前がでるのでクリックしてマイページを選択します。
次のページに行くとページの初めか一番下にトークンの発行ボタンがありますので
そこで【トークンを発行する】を選択します。
トークンの発行画面がでてきます。
そこで
・トークン名(この名前で通知されます。呼び出しボタンのようなわかるものでOKです！)
・どこで受け取るか
（グループか個人か選択できます。店員さん全員に通知などの場合は事前にグループを作り選択します。
個人の場合は一番上の【1：1でLINE Notifyから通知を受け取る】を選択します。）
を選択して、決まりましたら一番したの発行するのボタンを押します。
そうするとトークンが発行されます！
注意書きのように、ここでしか発行されずに閉じるを押すと二度と表示されませんので
すぐにコピーをして、メモ帳などにはりつけてください。
次に下記のスプレッドシートを開き、自分のマイドライブにコピーします。
その後セルC4に先ほどコピーしたトークンを貼り付けます！
その後、拡張機能⇒Apps Scriptを選択して、GASエディタを開き、デプロイをしてウェブアプリのアドレスをセルC7にはりつけてください。
2024/3/14 追記
QRコードが表示されないときは、下の画像の上部に表示されている【アクセスを許可】を押してください。
(GoogleのAPIを使ってQRコードを生成しております。)
2024/4/15追記
Google Chart APIでのQRコード生成が提供終了した模様ですので、
QR code API(https://goqr.me/api/ )に、変更しております。
これで完成です！
ここで下に表示されたQRコードを読み込みますと通知がいきます！
セルC9の文字列を変えれば呼び出し時に表示される文字も変わるので
ここで1番テーブル、2番テーブル、、、のように変更してQRコードを発行すれば通知時にその文字が反映されていきます。
ここから今回つかったGASのコードです。
LINE Notifyの通知用のコードです。
function Button(number){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheetByName("notify");
// LINEから取得したトークン
let token = sheet.getRange(4,3).getValue();
//送信するメッセージ
let messageText = number + sheet.getRange(5,3).getValue();
let options = {
"method" : "post",
"headers" : {
"Authorization" : "Bearer "+ token
},
"payload" : {
"message" : messageText
}
}
let url = "https://notify-api.line.me/api/notify"
UrlFetchApp.fetch(url, options)
}
index.html呼び出し用です
function doGet(e) {
var number = e.parameter.number;
var html = HtmlService.createTemplateFromFile('index.html');
html.number = number
return html.evaluate();
}
表示されるページのHTMLです。
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<style>
/*全体*/
.hidden_box {
margin: 2em 0;/*前後の余白*/
padding: 0;
font-size: 100px;
}
/*ボタン装飾*/
.hidden_box label {
padding: 15px;
font-weight: bold;
border: solid 2px black;
cursor :pointer;
}
/*ボタンホバー時*/
.hidden_box label:hover {
background: #efefef;
}
/*チェックは見えなくする*/
.hidden_box input {
display: none;
}
/*中身を非表示にしておく*/
.hidden_box .hidden_show {
height: 0;
padding: 0;
overflow: hidden;
opacity: 0;
transition: 0.8s;
font-size: 50px;
}
/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
padding: 10px 0;
height: auto;
opacity: 1;
}
</style>
<script>
$(".title").on("click", function () {
$(this).toggleClass("change");
});
google.script.url.getLocation(function(location) {
const number = location.parameter.number;
console.log(number)
});
</script>
<center>
<div class="hidden_box">
<label for="label1" onclick="google.script.run.Button(<?=number ?>)"><?=number ?> 呼び出し</label>
<input type="checkbox" id="label1">
<div class="hidden_show">
<!--非表示ここから-->
<p>ただいま呼び出し中です。<br>しばらくお待ちください。</p>
<!--ここまで-->
</div>
</div>
</center>
</body>
</html>
HTMLでパラメータの引き渡しなどしております。
いろいろなところにQRコードを貼っていろんなところにデジタル呼び出しボタンを作って遊んでください！！
ちなみにLINE Notifyは1時間に1000通知まで、1アカウントあたり100個までトークン発行という制限がありますが
ほぼほぼ引っかからないと思います！
不明点がございましたらご遠慮なくコメント欄に記載してください！
2022/12/27
GASのデプロイの記載を忘れていたので記載いたしました。。。