我使用 Google 脚本实现了身份验证过程，但使用了 payload 选项中的用户名和密码值的硬编码数据，我可以'当用户按下 Login 按钮时，找不到从 html 页面获取这些值的方法...
有没有办法将该值从输入字段获取到payload选项？
这是我的代码:
HTML:
<body>
<form>
<fieldset class='login'>
<div class="required">
<label for="email">Email:</label>
<input type="text" name="email" id="email" class="input-text" />
</div>
<div class="required">
<label for="pass">Password:</label>
<input type="password" name="pass" id="pass" class="input-password" />
</div>
</fieldset>
<input type="submit" id="submit-btn" value="Login" name='Submit' class='btn'/>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$('#submit-btn').click(function() {
google.script.run.login();
});
</script>
</body>
Google 脚本:
function onOpen() {
SpreadsheetApp.getUi()
.createMenu('Menu')
.addItem('Show sidebar', 'showSidebar')
.addToUi();
}
function showSidebar() {
var html = HtmlService.createHtmlOutputFromFile('login')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setTitle('SDR Tag Governance')
.setWidth(300);
SpreadsheetApp.getUi()
.showSidebar(html);
}
function login(){
var endpoint = 'login';
var url = 'https://example.com/api/'+endpoint;
var payload = {
'username' : 'email', //Add here the value from #email input
'password' : 'pass' //Add here the value from #pass input
}
var headers = {
'Connection':'keep-alive',
'Content-Type':'application/json;charset=utf-8',
'Accept':'application/json, text/plain, */*',
}
var options = {
'method' : 'post',
'headers' : headers,
'payload': JSON.stringify(payload),
};
var urlResponse = UrlFetchApp.fetch(url, options);
Logger.log(urlResponse);
}
我尝试将此代码添加到 HTML 页面:
<script>
$('#submit-btn').click(function() {
google.script.run
.withSuccessHandler(function(response) {
return urlResponse;
})
.login({
email: $('#email').val(),
pass: $('#pass').val()
});
});
</script>
具有GS功能:
function login(email,pass){
var endpoint = 'login';
var url = 'https://example.com/api/'+endpoint;
var payload = {
'username' : email,
'password' : pass
}
var headers = {
'Connection':'keep-alive',
'Content-Type':'application/json;charset=utf-8',
'Accept':'application/json, text/plain, */*',
'Cookie':'...',
}
var options = {
'method' : 'post',
'headers' : headers,
'payload': JSON.stringify(payload),
};
var urlResponse = UrlFetchApp.fetch(url, options);
Logger.log(urlResponse);
}
但是没用...
最佳答案
在您的原始 HTML 文件中，您没有将任何内容传递给 .gs 文件中的 login() 函数。您可以使用 jquery 来获取这些值。
<script>
$('#submit-btn').click(function() {
google.script.run
.withSuccessHandler(function(response) {
// this is where you handle the response from your Code.gs
})
.withFailureHandler(function(error) {
console.log(error);
})
.login({
email: $('#email').val(),
pass: $('#pass').val()
});
});
</script>
编辑:gs文件中的登录功能
function login(data){
// i dont think you need this endpoint variable
var endpoint = 'login';
var url = 'https://example.com/api/'+endpoint;
// since you are passing in an object in the html, you can
// access the properties of data
var payload = {
'username': data.email,
'password': data.pass
}
// this is the same as your original
var headers = {
'Connection':'keep-alive',
'Content-Type':'application/json;charset=utf-8',
'Accept':'application/json, text/plain, */*',
'Cookie':'...',
}
// are you sure you need to JSON.stringify the payload?
// try just passing the payload object as is
var options = {
'method' : 'post',
'headers' : headers,
'payload': JSON.stringify(payload),
};
var urlResponse = UrlFetchApp.fetch(url, options);
// Logger.log shows you what comes back
// when that is fine change it to return urlResponse;
// this will then get sent to the withSuccessHandler that is
// in your HTML file.
Logger.log(urlResponse);
}
关于javascript - 谷歌脚本: get values from input forms，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37698752/