【Google Apps Script】document.getElementById("serchStaff").value = result/"Error";の意味

やりたいこと

Google Apps Scriptの練習をしています。以下の資料を参考に、検索機能を作成しています。
code.gsの機能(gsのfunction)をHTMLファイルで使えるようにしています。
そのHTMLの<body></body>中に、window.onload = function() {}が使われています。
これを使う意味を理解したいと考えています。

 <!DOCTYPE html>
<html>
 <head>
   <base target="_top">
   <?!= include('css'); ?>
 </head>
 <body>
   <div class ="innner_contents">
     <p>値が更新されました。スタッフ検索のシートをご確認ください。</p>
     <textarea id="serchStaff"></textarea>
   </div>

//以下の部分の特に、function onSuccess(result){}/function onFailure(e){}の機能を確認したいと考えています。
　　 <script>
 window.onload = function() {
   google.script.run
     .withFailureHandler(onFailure)
     .withSuccessHandler(onSuccess)
     .staffInformation();
 }

 function onSuccess(result) {
   document.getElementById("serchStaff").value = result;
 }

 function onFailure(e) {
   document.getElementById("serchStaff").value = "Error";
 }
</script>
 </body>
</html>

確認したい点

「google.script.run.(取得に成功した時の処理).(取得に失敗した時の処理).実行処理」という書き方はパターン化された一般的な書き方なのでしょうか？
「 document.getElementById("@@@").value = result;」で、初めて「=result」「="Error"」が登場したのですが、これは、このようなものとして理解して良いのでしょうか？

参考URL

【GAS】Google Apps Script 活用事例　簡易スタッフ検索システムを作ちゃった話。

mkk

2020/06/26 00:56

> そのHTMLの<body></body>中に、window.onload = function() {}が使われています。添付のソースも参考URLも、window.onloadはbodyの外に出ているように感じますがどの部分のことを仰っているのでしょうか？

YousukeTanaka

2020/06/26 04:41

大変失礼いたしました。誤りでしたので、修正しました。

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

回答2件

「google.script.run.(取得に成功した時の処理).(取得に失敗した時の処理).実行処理」という

書き方はパターン化された一般的な書き方なのでしょうか？

google.script.run は HTMLOutput などでクライアント側に描画された画面からサーバ側の gs にあるスクリプトを呼びだすための方法です。
.gs 上の google apps script は、この方法を通じてしか html から呼び出すことができません。

「 document.getElementById("@@@").value = result;」で、初めて「=result」「="Error"」が登場したのですが、これは、このようなものとして理解して良いのでしょうか？

「このようなもの」がどのようなものであるかの情報がないので、良いとも良くないとも回答できません。

投稿2020/06/26 08:03

papinianus

総合スコア12705

参考URLではwindow.onloadがbodyの外に出ていますが、
bodyの中に入れるという修正をしてしまって良かったですかね？
でも今回の質問に直結する訳ではないのでそちらは置いておいて、質問への回答をします。

1.「google.script.run.(取得に成功した時の処理).(取得に失敗した時の処理).実行処理」という書き方はパターン化された一般的な書き方なのでしょうか？

同期処理を行う場合には必要な書き方かと思います。
サーバ側で処理されるものとクライアント側で処理されるものがある場合、
それを単純に並べると非同期処理となってしまいます。

本当はサーバ側でstaffInformation()関数の実行が終わり、戻り値（スタッフ情報）が返ってきてから
次の関数の処理に移りたいところですが、非同期処理だとサーバからの返答を待たずに次の処理が進みます。
そのため、記載していただいているような書き方が必要になります。
そうすることで、
staffInformation()関数実行
→成功したら返ってきたスタッフ情報をhtmlのテキストエリアに入れる
→失敗したら「Error」という文字をhtmlのテキストエリアに入れる
という処理が可能になります。
分かりやすそうな参考サイト

「 document.getElementById("@@@").value = result;」で、初めて「=result」「="Error"」が登場したのですが、これは、このようなものとして理解して良いのでしょうか？

質問の内容が少し分かりづらいですが、「初めて登場した」という文面から見るに、宣言していないのに使って良いのか？
という意味でしょうか？
今回の下記の処理は

window.onload = function() {
   google.script.run
     .withFailureHandler(onFailure)
     .withSuccessHandler(onSuccess)
     .staffInformation();
 }

 function onSuccess(result) {
   document.getElementById("serchStaff").value = result;
 }

 function onFailure(e) {
   document.getElementById("serchStaff").value = "Error";
 }

①staffInformation関数をサーバ側で実行して終了を待つ
②成功したらstaffInformation()の結果をonSuccess関数の引数（result）に渡して実行する
③失敗したら失敗の内容をonFailureの引数（e）に渡して実行する
という流れです。
つまりfunction onSuccess(result)の「result」に検索したスタッフ情報が入ってくるため
document.getElementById("serchStaff").value = result;　は
document.getElementById("serchStaff").value = 返ってきたスタッフ情報;　という意味になります。

投稿2020/06/26 05:54

mkk

総合スコア378