Javascript 使用AppScript在WebApp中打印输出

函数doGet（）{
返回HtmlService.createHtmlOutfromFile（“vi”）；
//var output=HtmlService.createHtmlOutput（'Hello，world！'）；
}
函数doPost（）{
返回HtmlService.createHtmlOutfromFile（“vi”）；
//var output=HtmlService.createHtmlOutput（'Hello，world！'）；
}
//作用于https://stackoverflow.com/a/9733420/3695983                     
功能亮度（r、g、b）{
变量a=[r，g，b].map（函数（v）{
v/=255；
返回v色2发光
（（色度2发光+0.05）/（色度1发光+0.05））
：（（色度1发光+0.05）/（色度2发光+0.05））；
回报率；
//Logger.log（比率）；
}
函数hexToRgb（hex）{
var shorthandRegex=/^#？（[a-f\d]）（[a-f\d]）（[a-f\d]）$/i；
十六进制=十六进制替换（shorthandRegex，函数（m，r，g，b）{
返回r+r+g+g+b+b；
});
var result=/^#？（[a-f\d]{2}）（[a-f\d]{2}）（[a-f\d]{2}）$/i.exec（十六进制）；
返回结果{
r:parseInt（结果[1]，16），
g:parseInt（结果[2]，16），
b:parseInt（结果[3]，16）
}：null；
}
//document.querySelector（“btn”）.addEventListener（“单击”，函数）（）{
//常数比=计算器（）；
////根据WCAG要求显示结果
//常数结果=`
//AA级大文本：${比率<1/3？'PASS'：'FAIL'}

//AA级小文本：${比率<1/4.5？'PASS'：'FAIL'}

//AAA级大文本：${ratio<1/4.5？'PASS'：'FAIL'}

//AAA级小文本：${ratio<1/7？'PASS'：'FAIL'}
// `;
//document.querySelector（“#result”）.innerHTML=result；
//}）；

前景色：
背景色：
计算颜色对比度
结果:
document.getElementById（“btn”）。addEventListener（“单击”，doStuff）；
函数doStuff（）{
var fcolor=document.getElementById（“color-1”）.value；
var bgcolor=document.getElementById（“color-2”）.value；
google.script.run.withSuccessHandler（比率=>{
常数结果=`
AA级大文本：${比率<1/3？'PASS'：'FAIL'}

AA级小文本：${比率<1/4.5？'PASS'：'FAIL'}

AAA级大文本：${ratio<1/4.5？'PASS'：'FAIL'}

AAA级小文本：${ratio<1/7？'PASS'：'FAIL'}`；
document.getElementById（“#result”）.innerHTML=result；
}).计算（fcolor、bgcolor）；
}
//document.getElementById（“btn”）.addEventListener（“单击”，函数）（）{
//常数比=计算器（）；
////根据WCAG要求显示结果
//常数结果=`
//AA级大文本：${比率<1/3？'PASS'：'FAIL'}

//AA级小文本：${比率<1/4.5？'PASS'：'FAIL'}

//AAA级大文本：${ratio<1/4.5？'PASS'：'FAIL'}

//AAA级小文本：${ratio<1/7？'PASS'：'FAIL'}
// `;
//document.querySelector（“#result”）.innerHTML=result；
// });

修改点：

• 当您想从HTML端运行Google Apps脚本时，请使用

  Google.Script.run

  。当我看到您的脚本时，似乎将

  Google.Script.run

  用作注释行。在这种情况下，为了使用Google Apps脚本返回的值，使用了

  with SuccessHandler

当上述各点反映到脚本中时，它将变成如下所示

function doStuff(){
  var fcolor = document.getElementById("color-1").value;
  var bgcolor = document.getElementById("color-2").value;

  google.script.run.withSuccessHandler(ratio => {
    const result = `
    AA-level large text: ${ratio < 1/3 ? 'PASS' : 'FAIL' }<br>
    AA-level small text: ${ratio < 1/4.5 ? 'PASS' : 'FAIL' }<br>
    AAA-level large text: ${ratio < 1/4.5 ? 'PASS' : 'FAIL' }<br>
    AAA-level small text: ${ratio < 1/7 ? 'PASS' : 'FAIL' }`;
    document.getElementById("#result").innerHTML = result;
  }).calculateRatio(fcolor, bgcolor);
}

修改脚本： 请修改

doStuff（）

，如下所示

function doStuff(){
  var fcolor = document.getElementById("color-1").value;
  var bgcolor = document.getElementById("color-2").value;

  google.script.run.withSuccessHandler(ratio => {
    const result = `
    AA-level large text: ${ratio < 1/3 ? 'PASS' : 'FAIL' }<br>
    AA-level small text: ${ratio < 1/4.5 ? 'PASS' : 'FAIL' }<br>
    AAA-level large text: ${ratio < 1/4.5 ? 'PASS' : 'FAIL' }<br>
    AAA-level small text: ${ratio < 1/7 ? 'PASS' : 'FAIL' }`;
    document.getElementById("#result").innerHTML = result;
  }).calculateRatio(fcolor, bgcolor);
}

函数doStuff（）{
var fcolor=document.getElementById（“color-1”）.value；
var bgcolor=document.getElementById（“color-2”）.value；
google.script.run.withSuccessHandler（比率=>{
常数结果=`
AA级大文本：${比率<1/3？'PASS'：'FAIL'}

AA级小文本：${比率<1/4.5？'PASS'：'FAIL'}

AAA级大文本：${ratio<1/4.5？'PASS'：'FAIL'}

AAA级小文本：${ratio<1/7？'PASS'：'FAIL'}`；
document.getElementById（“#result”）.innerHTML=result；
}).计算（fcolor、bgcolor）；
}

注:

• 在这种情况下，您的HTML和Javascript需要包含在Google Apps脚本项目中。请注意这一点
• 在这次修改中，它假定您的Google Apps脚本的

  Calculatario

  工作正常，并返回正确的值

参考：

---

感谢您的宝贵意见，但它仍然没有在webapp上返回任何内容。@tanaike请回复@tanaike@kanupriya感谢您的回复。关于

请回复

，我为我的迟回复深表歉意。这是由于我的情况。关于您的问题，不幸的是，我无法复制它。当我测试它时，从浏览器上会显示GAS side中的m

calculateRatio

。对此我深表歉意。例如，当您将Web应用重新部署为新版本并再次测试它时？因为最新脚本会通过将Web应用重新部署为新版本反映出来。我对此感到担心。@kanu priya即使您将Web应用重新部署为新版本，也可以您提供了复制问题的整个脚本？如果可以，请将其添加到您的问题中。这样，我想确认一下。当然@tanaike，将最新脚本添加到我的问题中。是的，我重新部署了Web应用，但是没有得到预期的响应。我认为这里的问题源于您的应用脚本功能和您所使用的值正在您的web应用程序中进行输入。您是否单独测试了这些功能？此外，您是否在进行任何更改后重新部署了web应用程序？是的，我通过传递颜色值单独测试了这些功能，它们正常工作。是的，我也重新部署了web应用程序@ale13。@ale13是的，它正在与新部署一起工作