GASでHTMLページ上にURLパラメータを表示させる

前提・実現したいこと

GAS, Javascript, HTML初心者です．

GAS，HTMLservice, Google sheetsを用いて店舗間の在庫共有システムを作っています．

htmlヘッダー部にurlパラメータを表示させる方法を試みています．

予めurlに?param=testとしてパラメータを付与してあります．

発生している問題・エラーメッセージ

ページ上に反映されません．

該当のソースコード

Code.gs

var ss_id = 'スプレッドシートのID';

function doGet(e) {
  return HtmlService.createTemplateFromFile("customer").evaluate();
}

function customer_input(lastname, firstname, sex, tel, bday, email, adress) {
  var sh_name = '顧客情報';
  var sh = SpreadsheetApp.openById(ss_id).getSheetByName(sh_name);
  var lastrow = sh.getLastRow();
  sh.appendRow([lastrow, lastname, firstname, sex, tel, bday, email, adress, new Date()]);

  return "顧客情報を入力しました";
}

function open_purchase(){
  return HtmlService.createTemplateFromFile("purchase").evaluate();
}

customer.html

<!DOCTYPE html>
<html>
<head>
  Customer data<br>
  <!--ここにURLパラメータを表示させたい-->

</head>

<body>
  <label>last name</label><input type="text" id="lastname"><br>
  <label>first name</label><input type="text" id="firstname"><br>

  <select id="sex">
    <option value="MALE">男性</option>
    <option value="FEMALE">女性</option>
  </select><br>
  <label>TEL</label><input type="text" id="tel"><br>
  <label>Birthday</label><input type="date" id="bday"><br>
  <label>E-mail</label><input type="text" id="email"><br>
  <label>Adress</label><input type="text" id="adress"><br>

  <button id="submit">submit</button>
  <button id="norder">new order</button>

  <script>    
    document.getElementById("submit").onclick = input_to_sheet;
    document.getElementById("norder").onclick = open_page;

    function input_to_sheet() {
      var lastname = document.getElementById("lastname").value;
      var firstname = document.getElementById("firstname").value;
      var sex = document.getElementById("sex").value;
      var tel = document.getElementById("tel").value;
      var bday = document.getElementById("bday").value;
      var email = document.getElementById("email").value;
      var adress = document.getElementById("adress").value;

      google.script.url.getLocation(location => {
        google.script.run
          .withFailureHandler(onFailure)
          .withSuccessHandler(onSuccess)
          .customer_input(lastname, firstname, sex, tel, bday, email, adress, location.parameter["store"]);
      });  
    }
    function onSuccess(result) {
      alert(result);
    }
    function onFailure(e) {
      alert([e.message, e.stack]);
    }


    function open_page() {
      google.script.url.getLocation(location => {
        google.script.run
          .withFailureHandler(onFailure)
          .withSuccessHandler(onSuccess)
          .open_purchase();
      });  
    }
    function onSuccess(result) {
      alert(result);
    }
    function onFailure(e) {
      alert([e.message, e.stack]);
    }
  </script>
</body>
</html>

試したこと

location.searchとgoogle.script.url.getlocation等を試しましたが，いずれも反映されません．
おそらく書き方が悪いだけなのですが．．．

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

回答1件

ベストアンサー

パラメータをそのままhtmlコンテンツのテキストにほりこんでから表示させれば行けるんじゃないでしょうか。

GAS
1function doGet(e) {
2var param = e.parameter.param;
3var html =  HtmlService.createHtmlOutputFromFile("customer");
4var content = html.getContent().replace(/%param%/,  param );
5return HtmlService.createHtmlOutput(content);
6}

html
1<head>
2  Customer data<br>
3  <%param%>
4</head>

投稿2019/10/28 06:26

hiroshi0240

総合スコア640

grouper

2019/11/05 02:57

hiroshi0240様ご回答ありがとうございました。無事、ご教授頂いた内容で目的を達成することができました。ありがとうございました。

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

あなたの回答

tips

プレビュー

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

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

『🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中！

＼teratail特別グッズやAmazonギフトカード最大2,000円分が当たる！／

GASでHTMLページ上にURLパラメータを表示させる

前提・実現したいこと

発生している問題・エラーメッセージ

該当のソースコード

試したこと

関連した質問