gpt4 book ai didi

javascript - 谷歌应用程序 : More than one HTML or script file in the same App Project and add Login?

转载 作者:行者123 更新时间:2023-11-28 00:02:49 25 4
gpt4 key购买 nike

我尝试了很多次都没有成功调整template code到 Google Apps 脚本。此代码无法按预期对 Google Apps 脚本起作用。提前致谢...

代码.gs

    function doGet() {
return HtmlService.createTemplateFromFile('Main')
.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

function onLogin(form) {
if (form.username == "xxx") {
var template = HtmlService.createTemplateFromFile('Response');

//Setup any variables that should be used in the page
template.firstName = "Your name is here";
template.username = form.username;

return template.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.getContent();
} else {
throw "You could not be found in the database please try again.";
}
}

function include(filename) {
return HtmlService.createTemplateFromFile(filename)
.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.getContent();
}

Main.html

<?!= include('CSS'); ?>
<script>
function loadPage(htmlOut) {
var div = document.getElementById('content');
div.innerHTML = htmlOut;
document.getElementById('errors').innerHTML = "";
}
function onFailure(error) {
var errors = document.getElementById('errors');
errors.innerHTML = error.message;
}
</script>
<div id="errors"></div>
<div id="content">
<?!= include('Login'); ?>
</div>

CSS.html

<style>
p b {
width: 100px;
display: inline-block;
}
</style>

登录.html

<script>
function onLoginFailure(error) {
var loginBtn = document.getElementById('loginBtn');
loginBtn.disabled = false;
loginBtn.value = 'Login';
onFailure(error);
}
</script>
<div class="loginPanel">
<form>
<p>
<b>Username: </b>
<input type="text" name="username"/>
</p>
<input type="button" id="loginBtn" value="Login" onclick="this.disabled = true; this.value = 'Loading...';google.script.run
.withSuccessHandler(loadPage)
.withFailureHandler(onLoginFailure)
.onLogin(this.parentNode)"/>
</form>
</div>

响应.html

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1.1", {packages:["bar"]});
google.setOnLoadCallback(drawStuff);

function drawStuff() {
var data = new google.visualization.arrayToDataTable([
['Move', 'Percentage'],
["King's pawn (e4)", 44],
["Queen's pawn (d4)", 31],
["Knight to King 3 (Nf3)", 12],
["Queen's bishop pawn (c4)", 10],
['Other', 3]
]);

var options = {
title: 'Chess opening moves',
width: 900,
legend: { position: 'none' },
chart: { subtitle: 'popularity by percentage' },
axes: {
x: {
0: { side: 'top', label: 'White to move'} // Top x-axis.
}
},
bar: { groupWidth: "90%" }
};

var chart = new google.charts.Bar(document.getElementById('top_x_div'));
// Convert the Classic options to Material options.
chart.draw(data, google.charts.Bar.convertOptions(options));
};
</script>
</head>
<body>
<div id="top_x_div" style="width: 900px; height: 500px;"></div>
</body>
</html>

这是published app 。输入用户名:xxx。

最佳答案

有关代码的工作示例,请单击以下链接:

Apps Script - Visualization after Login

带有代码的 Apps 脚本文件:

Shared Apps Script File

我看到您希望在登录后显示一个图表。该图表的 HTML 文件有 <script>标记为:

google.load("visualization", "1.1", {packages:["bar"]});

我认为评估方法不会在发送回浏览器之前在服务器中创建图表。

此外,还有这一行:

google.setOnLoadCallback(drawStuff);

因为 google.load()函数没有运行,没有回调。所以,drawStuff()注入(inject) HTML 时函数永远不会被调用。

您无法动态添加 <script>标记为 HTML 并让它运行。您需要添加所有 <script>当应用程序首次运行时,将标签添加到 Main.html 页面。 可以创建一个新函数,然后在页面首次加载后随时运行该函数。您需要使用

var myFunc = new Function('a', 'b', 'return a + b');
myFunc(a,b);

Mozilla new function

还有一个问题。您需要删除:

this.disabled = true;

来自 onclick 属性。

所以,我会输入 <script>将可视化内容的标签添加到 Main.html 文件中。

关于javascript - 谷歌应用程序 : More than one HTML or script file in the same App Project and add Login?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31638429/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com