2
votes

I was trying code a BMI HTML web by Google app script. However, the result always didn't appear by doPost. My code is below :

Code.gs

function doPost(e){

 var h= e.parameter.h;
 var w = e.parameter.w;
 return 
HtmlService.createHtmlOutput("bmi="+w/((h*h)/10000));
}

function doGet(e)
{

var t = HtmlService.createTemplateFromFile('Index');
t.serviceUrl = ScriptApp.getService().getUrl();
return t.evaluate();

}

Index.html

<html>
<body>
<form id="bmiForm" action="<?= serviceUrl ?>" method="post">
 <div>height(cm): <input type="text" name="h"/></div>
 <div>weight(kg): <input type="text" name="w"/></div>
 <input type="submit" value="submit"/>
 </form>
 </body>
</html>

Look for Answer

1
Can you verify your event handler is getting called? Use console and send a log to Stackdriver (regular Logger will not be dependable for webapp situations) - tehhowch
If you are not familiar with the google.script.run.function() client side API, you might want to look at that. If you are using an Apps Script Web App, sidebar, or dialog box then that might be a better option. https://developers.google.com/apps-script/guides/html/reference/run If your HTML form is not an Apps Script Web App, that is different. If that's the case, then let us know. - Alan Wells

1 Answers

1
votes

Identified the error this script threw in the browser console -

Refused to display 'https://script.google.com/a/exotel.in/macros/s/WhateverScriptID/exec' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

Solution

Adding .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) while returning doPost's HTML output.

Refer Class HtmlOutput > setXFrameOptionsMode(mode).

Code.gs

function doPost(e) {
  var h= e.parameter.h;
  var w = e.parameter.w;
  return HtmlService.createHtmlOutput("bmi="+w/((h*h)/10000)).setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}

function doGet(e) {
  var t = HtmlService.createTemplateFromFile('Index');
  t.serviceUrl = ScriptApp.getService().getUrl();
  return t.evaluate();
}

Index.html

This remains the same -

<html>

<body>
    <form id="bmiForm" action="<?= serviceUrl ?>" method="post">
        <div>height(cm):
            <input type="text" name="h" />
        </div>
        <div>weight(kg):
            <input type="text" name="w" />
        </div>
        <input type="submit" value="submit" />
    </form>
</body>

</html>

This will display the desired results.