実現したいこと
GASで作成したHTMLの実行ボタンを押すとGASで作成したJSが起動してLINEにメッセージを送付するようにしたい。
発生している問題・分からないこと
HTMLで作成したボタンからJSが実行できず、処理が動作しない。
JS側について、単体では動作確認問題なし。
根本的にこの実装であっているかやや疑問。特にURLでGASのJSを実行させる、という部分がよく理解できない。JSの関数名をボタンクリック時のJS関数として埋め込む、とかの方がイメージ湧くんだけど、ChatGPTでこの方法を推薦したので採用したが、よくわかってないです。
JS
1function notify() { 2 var message = 'Hello'; 3 var token = 'LINE TOKEN'; // LINE Notifyのアクセストークンに変更する 4 5 // LINEに送付 6 UrlFetchApp.fetch('https://notify-api.line.me/api/notify', { 7 method: 'post', 8 headers: {'Authorization': 'Bearer ' + token}, 9 payload: {'message': message} 10 }); 11}
HTML
1<!DOCTYPE html> 2<html lang="en"> 3<head> 4<meta charset="UTF-8"> 5<meta name="viewport" content="width=device-width, initial-scale=1.0"> 6<title>LINEへの通知実行ボタン 7</title> 8</head> 9<body> 10 <h1>LINEへの通知実行ボタン</h1> 11 <p>以下のボタンより実行します。</p> 12 <button id="myButton">ここをクリック</button> 13 14 <script> 15 // ボタンがクリックされたときに実行される関数 16 function executeFunction() { 17 // Google Apps Script関数を実行するためのURL 18 var url = "URL"; 19 20 // Google Apps Script関数を実行するためのHTTPリクエストを送信 21 var xhr = new XMLHttpRequest(); 22 xhr.open("GET", url); 23 xhr.send(); 24 } 25 26 // ページが読み込まれたときに実行される関数 27 window.onload = function() { 28 // ボタンに関数を関連付ける 29 var button = document.getElementById("myButton"); 30 button.onclick = executeFunction; 31 }; 32 </script> 33</body> 34</html>
エラーメッセージ
error
1F12で最後まで処理が通っており、以下のエラーは出ていたのを確認しているが、やはり根本的に実装についてやや疑問 2 3Access to XMLHttpRequest at 'https://script.google.com/macros/s/スクリプトID/exec' from origin 'URL' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 4 5 6VM26:13 7 8GET https://script.google.com/macros/s/スクリプトID/exec net::ERR_FAILED 302 (Found)
該当のソースコード
HTML
1問題の箇所に記載したため略
試したこと・調べたこと
- teratailやGoogle等で検索した
- ソースコードを自分なりに変更した
- 知人に聞いた
- その他
上記の詳細・結果
全然違う方法で実装しているような気がしたが、解読できず。
参考
https://qiita.com/fujino-fpu/items/4a63cbde8e75e3fba9f4
https://uncle-gas.com/gas-html-order-form/
補足
特になし

回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2024/03/26 15:01