質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.59%

GASのPostでのフォーム値の渡し方

解決済

回答 3

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 6,779

score 14

POSTで送信したいのですが、どうするべきか困っています。
何度か試しているところで、画面遷移が別タブで開き、真っ白なページが出ます。

その様子だと名前=値の形で入っているようですが、URL上では渡せない内容のためPOSTで受け取りたいです。

JSファイルで一旦送信確認をし、google.script.run.doPost(引数);で実行しているのですが、真っ白なページが返ってきます。

もうなんども調べているのですが、よくわからないので、聞いています。
ちなみにそのPostの中ではdoPost(e){}で受け取り、e.parameter.nameという形で取得しようとしていました。

わかる方いましたら、Postはどんな形で送信されているのか教えて欲しいです。

追記

<body>
    <div class="container">
     <form class="form-horizontal" id="resev-form" action="https://script.google.com/・・・/exec"
     method="post" target="_blank">

      <div class="form-group">
      <label class="control-label col-xs-3 col-la-3" for="input-id1">名前</label>
        <div class="col-xs-3 col-la-3">
          <input type="text" class="form-control" id="input_id1" name="name">
          <div class="help-block with-errors"></div>
        </div>
      </div><!--form-group-->

      <div class="form-group">
            <div class="col-xs-offset-3 col-xs-9">
                <button id="send_button" type="submit" class="btn btn-primary btn-block">
                 送信する
                </button>
            </div>
        </div>

    </form>
    </div>
  </body>
function doGet(){
  var HtmlOutput = HtmlService.createHtmlOutputFromFile('html');
  return HtmlOutput;
}


function doPost(e){

  var val = e.parameter.name;
  Logger.log(e);
 return ContentService.createTextOutput(e.parameter.name);
}
↓でリターンを試みたりもしましたが同じ結果です、ポストに入りません。
return HtmlService.createHtmlOutputFromFile("thanks");

まだ色々試していますがうまくいきません。4/4

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 3

check解決した方法

+1

随分経ちましたが進展があったのでまとめます。

1.まず、PostしたいデータがForm送信でOKな場合は、

type="submit"  → function getPost(e){ var name = e.parameters.name;}

値の取得が可能でした。
SubmitのHTMLとGASファイルは同一プロジェクトです。

parameter(s無し)だと、1つ目のパラメータの値か、何も取れないです。
なのでFormの送信データが1つだけの場合はparameterで取得できます。

※ちなみにForm-dataだとparametersで取得。

application/application/x-www-form-urlencodedだと、
e.postData.getDataAsString()で取得できる。

2.jsonデータを飛ばすことも別で試み

別ファイルかHTMLファイル内にjsを書いてPost送信をしようとしたけれども、数個のForm送信なら、すんなりうまくいきました。

$ ->
    $('form').on 'submit', (e) -> e.preventDefault()
      form_url  = $(this).attr("action")
      form_type = $(this).attr("method").toUpperCase()
      form_data = $(this).serialize()
      $.ajax
        url: form_url
        type: form_type
        data: form_data
          dataType: 'json'
          crossDomain: true
          cache: false
          followAllRedirects: true


拾ってきたカフェスクリプトのコードですが、普通にajaxで送信できます。

でも、データ制限に引っかかるのか分かりませんが、データの多いjsonを送ろうとすると
Access-Control-Allow-Origin (クロスドメイン)
で引っかかり、サーバーからのレスポンスヘッダーを変更しなければ解決できないため、GASでは無理です。

なので単純にフォームのデータを送信するならSubmitで完了させるのが無難でやり易いと分かりました。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

0

真っ白なページという事象はよくわかりませんが以下の方法でPOSTの内容は取得できます。

doPost(e){}上で、
HtmlService.createTemplateFromFile
を使い、POST後に表示したい、htmlを作成します。
以下ではresultsと指定しています。

function doPost(e){
  //データ取得
     var title = e.parameter.name;
     var temp = HtmlService.createTemplateFromFile('results');
     temp.data = title;
     return temp.evaluate().setSandboxMode(HtmlService.SandboxMode.NATIVE);
}

doPostから新たなwebページを表示する場合は指定した
results.html
内で
<?= data ?>
を取得します。

<script>
var inputdata = String("<?= data ?>");
</script>

あいにくどんな形式という事まではわかりかねます。

以降追記
GASのURLはexecで終わるものとなります。

<form method="post" action=“【https://script.google.com/で始まるGASのURL】”target="_blank">
    <p>
      <label>name<input type="text" name="name"></label>
    </p>
    <br>
    <p>
      <input type="submit" value="送信">
    </p>
</form>

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/04/06 23:51

    時間があいてしまって申し訳ありません。
    その後、自分でも新規にプロジェクトを作成して試みたのですが、できませんでした。

    上の回答では正しくない可能性があります。
    Gsuiteになる前の知識で答えてしまっています。
    今のところ正しい回答ができない状態です。
    申し訳ありません。
    業務で使う事もあるので何か分かり次第こちらで回答する様に努めます。

    キャンセル

  • 2019/04/08 14:07

    通知が確認できず遅くなりました。
    私の方も色々とやってみているのですが、解決に至っていません。
    ただ、一個可能性が潰せたので助かります。
    何かと変更点が出てきているようで、他の記事をみても今使えないものが結構出ているようです。何かわかり次第追加できたらと思います。

    キャンセル

  • 2019/04/08 14:12

    この問題以外と根深いですね。多くの人が意外と困っている事と思います。
    以前自分が調べた時も
    <script>
    var inputdata = String("<?= data ?>");
    </script>
    すらわからず非常に苦労しました。
    微力ながらお役にたてた様でなによりです。

    キャンセル

0

Postはどんな形で送信されているのか

(質問をコードで示してください。そうでなきゃマトモな回答になりません)

google.script.run.doPost(引数);としたときdoPosteは引数に書いたものがそのママ入ります。例えば、

<select id="sel" name="sel" onchange"google.script.run.doPost(this.value);">
<option value="R">令和</option>


としたとき、

function doPost(e) {
  var val = e;
}


のvalには"R"が入ります。

e.parameterの形式で取れるのは、"http://...../exec"で表現されるwebアプリケーションのエンドポイントに、httpメソッドpostでformなり何らかのデータが送信されたときだけで、google.script.runに複数の値をわたしたいときは、自分で、eにわたしたいものを組み立てる必要があります。

従って、↓こういう面倒なことをすれば

<select id="sel" name="sel" onchange"send(this.value);">
<option value="R">令和</option>
</select>
<script>
function send(val) {
  const param = {"parameter":{"name":val}}
  google.script.run.doPost(param);
}
</script>
function doPost(e) {
  var val = e.parameter.name;
}


このようにして、valに"R"を取り出すことができます。

あらためて、コードを示してください。引数と隠蔽して書いている部分が致命的に重要なのです。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/04/02 00:57

    質問2つ出しててすみません。
    とても疑問に思っていたところを的確に答えていただきありがとうございます。
    2日くらい悩んでいて、色々検索したのですが理解できず、重要な部分が出てなかったように思います。
    シンプルに対処できるように考え直してみます。ありがとうございます。

    キャンセル

  • 2019/04/02 01:19

    一応、追記するが、google.script.run.doPost(formObject)とした場合、doPost(e)の内部では
    `e.[htmlのinputのname]`とすれば、値が取れる、`e.parameter.[htmlのinputのname]`ではない(parameterが勝手につくことはないし、また自分でそのようにパラメータを成形する意味もない)。

    キャンセル

  • 2019/04/02 01:22

    なんとか解決したいという気概は買うし、質問が多いとそれだけで避けられてしまうことが多いのも事実だが、まとめるべきはまとめて欲しい。
    とりあえず、こちらは、自己解決なりで、クローズして、元質問に、こっちでききたかったことをまじえて整理するのが良いように思う。
    質問者様がこれで「うっへぇ」と思わず、回答者としての私に期待していただけるよう頑張りたいと思う。

    キャンセル

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

  • ただいまの回答率 87.59%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る