GASでのdoPost()での完了表示（HTML）がエラーになってしまう。問題箇所がわからない

doGet(e)にパラメータとして特定のスプレッドシートのIDを渡し
⇒doGetからコメント入力用シート（HTML）を表示させる⇒doPost(e)で先のIDとコメントをパラメータで受け取って処理⇒HTMLで完了表示
をさせたいのですが、最後の「HTMLで完了表示」部分で「script.google.com で接続が拒否されました。」となり、表示がさせられません。

[対象のプロジェクトのWEBアドレス?ssid=+スプレッドシートID]で以下のdoGetを実行

GAS
1function doGet(e){
2  var ID = e.parameter.ssid;
3  var html =  HtmlService.createHtmlOutputFromFile("コメント入力シート");
4  var content = html.getContent().replace(/%ID%/,  ID );
5  return HtmlService.createHtmlOutput(content);
6}

「コメント入力シート」

html
1<!DOCTYPE html>
2<html>
3  <body>  
4　　 <form method="post"  action="対象のプロジェクトのWEBアドレス">
5　　<div>
6    <label for="msg">コメント入力BOX</label>
7    <textarea id="msg" name="coment"></textarea>
8    <input type="hidden" name="id" value=%ID%>
9　　</div>
10    <div class="button">
11    <button type="submit">送信する</button>
12    </div>
13   </form>
14  </body>
15</html>

GAS
1function doPost(e) {
2  var coment = e.parameter.coment;
3  var ID = e.parameter.id;
4　input(coment,ID);
5  return HtmlService.createTemplateFromFile("完了表示").evaluate();
6}
7function input(coment,ID){
8  var ss = SpreadsheetApp.openById(ID);
9  var S1 = ss.getSheetByName('回覧情報'); 
10  S1.getRange(1,1).setValue(coment);
11}

「完了表示」

html
1<!DOCTYPE html>
2<html>
3  <head>
4    <base target="_top">
5  </head>
6  <body>
7    <h1><font color="#ff0000">実行完了</font></h1>
8    <br>
9    テキストの入力を完了しました。<br>   
10  </body>
11</html>
12

papinianus

2018/11/21 07:53

権限だと思うのですが、webアプリの実行権限はどうなっていますか？

hiroshi0240

2018/11/21 08:16

連絡ありがとうございます。実行権限はフルでついています。というか開発者本人が実行してもエラーになります。

hiroshi0240

2018/11/21 08:26

ちなみに、doPost以降を別のプロジェクトファイルで作成してみると、うまく表示されましたが、これだとコメント入力シートの入力後にもまたGoogleの「Permission」画面がポップアップされてしまうので、避けたいのです。

行動規範の内容に同意します

回答1件

ベストアンサー

再現させてみました。sameoriginじゃないからでしたね
(エラーのときは、ブラウザの開発者ツールを開いてください)

この問題は、gasを使ってページ表示する限りは回避できないと思うので↓こうすることを提案します

コード.gs

doPost廃止
完了表示.html廃止
inputがリターンする

javascript
1function doGet(e){
2  var ID = e.parameter.ssid;
3  var html =  HtmlService.createHtmlOutputFromFile("コメント入力シート");
4  var content = html.getContent().replace(/%ID%/,  ID );
5  return HtmlService.createHtmlOutput(content);
6}
7function input(coment,ID){ //リターンを持つ。try catchしてこいつがちゃんと判断する
8  try{
9    var ss = SpreadsheetApp.openById(ID);
10    var S1 = ss.getSheetByName('回覧情報'); 
11    S1.getRange(1,1).setValue(coment);
12  }
13  catch(e) {
14    return "失敗";
15    }
16  return "完了"
17}

コメント入力シート.html

actionなし
divを足す(response)→まあこの辺はお好みで。
hiddenのやつは、id="id"にする(name="id"じゃなく)
非同期でサーバスクリプトを実行させる仕組みを使う

→成功時のコールバックで、同じページにメッセージを出す

html
1<!DOCTYPE html>
2<html>
3  <script>
4    function posting() {
5      const id = document.getElementById("id").value;
6      const msg = document.getElementById("msg").value;
7      google.script.run.withSuccessHandler(writeResult).input(msg, id);
8      
9    }
10    function writeResult(message) {
11      document.getElementById("response").innerText = message;
12    }
13  </script>
14  <body>  
15　　 <form method="post"  action="#">
16　　<div>
17    <label for="msg">コメント入力BOX</label>
18    <textarea id="msg" name="coment"></textarea>
19    <input type="hidden" id="id" value=%ID%>
20　　</div>
21    <div class="button">
22    <button type="button" onclick="posting()">送信する</button>
23    </div>
24   </form>
25   <div id="response">
26   </div>
27  </body>
28</html>

投稿2018/11/21 09:19

papinianus

総合スコア12705

hiroshi0240

2018/11/22 10:35

再現までしていただきありがとうございます。やっとsameoriginの意味がわかりました。教えて頂いたHTML内でスクリプトを実行させる方法で対応進めようと思いますが、最終的には送信ボタン押下後は画面を変遷（送信ボタンと、コメント入力欄を消して、完了通知を表示）させる必要があるため、追加でコードを検討いたします。