我想使用 Google Apps 脚本构建多页面网站。为此，我想利用 doGet() 的功能来处理查询字符串。我知道至少有一个解决此问题的方法:
Linking to another HTML page in Google Apps Script
但是，该解决方案似乎过于严格，因为它依赖于 GAS 的 templated html feature在页面加载时在 HTML 中使用查询字符串构建正确的 URL。一个更通用的解决方案是在基于动态 UI 状态和用户界面操作的 jquery(或 javascript)函数中构建适当的查询字符串。这可能吗？如何做呢？
这是我对一个可能的解决方案的建议(这是行不通的!):
HTML/JQuery:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<title>Speedgolf Scoring</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
</head>
<body id = "mainBody">
<H1>LOGIN PAGE</H1>
<H3>Please choose interface:</H3>
<button id = "playerUI">Follow Player</button>
<button id = "holeUI">Follow Hole</button>
<button id = "flexUI">Roaming Scorer</button>
</body>
</html>
<script>
function loadNewPage(result, userObject) {
var newURL = result + userObject;
alert("Newly-constructed URL to be loaded: " + newURL); //CORRECT URL IS CONSTRUCTED BASED ON DEBUGGING OUTPUT!
window.open(newURL,"_self"); //<--THIS IS THE LINE THAT SHOULD INVOKE DOGET(). SERVER LOGS INDICATE DOGET() IS INVOKED, BUT NO PAGE IS VISIBLY SERVED.
}
$("#playerUI").click(function () {
alert("In player UI click...");
var newURL = "?mode=player";
google.script.run.withSuccessHandler(loadNewPage).withUserObject(newURL).getScriptURL();
//Execution continues in loadNewPage callback...
});
$("#holeUI").click(function () {
var newURL = "?mode=hole";
google.script.run.withSuccessHandler(loadNewPage).withUserObject(newURL).getScriptURL();
});
$("#flexUI").click(function () {
var newURL = "?mode=flex";
google.script.run.withSuccessHandler(loadNewPage).withUserObject(newURL).getScriptURL();
});
</script>
还有我的 Code.gs 文件:
function getScriptURL() {
var url = ScriptApp.getService().getUrl();
Logger.log('In getScriptURL...Value of URL returned: ' + url);
return url;
}
function doGet(e) {
Logger.log('In doGet');
Logger.log('query params: ' + Utilities.jsonStringify(e));
if (e.queryString === '') {
Logger.log('Serving loginUI');
return HtmlService
.createHtmlOutputFromFile('loginUI')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
.setTitle("Please log in");
}
//if here, we know query string is NOT null
if (e.parameter.mode == "player") {
Logger.log('Serving player UI');
return HtmlService
.createHtmlOutputFromFile('playerUI')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
.setTitle("Following Player");
}
if (e.parameter.mode == "hole") {
Logger.log('Serving hole UI');
return HtmlService
.createHtmlOutputFromFile('holeUI')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
.setTitle("Following Hole");
}
if (e.parameter.mode == "flex") {
Logger.log('Serving flex UI');
return HtmlService
.createHtmlOutputFromFile('flexUI')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
.setTitle("Flex Interface");
}
}
我能够通过服务器日志和警报框验证是否构建了带有查询字符串的正确 URL。我希望这行代码:
$("#mainBody").load(newURL);
调用 doGet() 并根据查询字符串加载新页面。但是，通过我的服务器日志，我观察到 doGet() 未被调用，因此我期望提供的新页面从未提供。怎么了？为什么当我通过 jquery 加载新页面时 doGet() 没有被调用？如何强制调用 doGet()？提前致谢!
最佳答案
啊哈!如果您更改上述代码将正常工作
window.open(newURL,"_self");
到
window.open(newURL,"_top");
我不确定为什么“_top”是必需的，但在上面的示例代码中，它使一切变得不同:使用正确的查询字符串调用 doGet()，从而提供预期的页面。万岁!这种动态提供新网页的方法为模板化 HTML 提供了强大的替代方案。享受吧!
关于javascript - Google Apps 脚本中的多页站点 : How to invoke doGet() through jquery or javascript?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46940930/