getElementById().click() 不在 if 语句范围内运行答案

【问题标题】：getElementById().click() not running in if statement scopegetElementById().click() 不在 if 语句范围内运行
【发布时间】：2019-12-11 11:39:42
【问题描述】：

我正在尝试运行以下代码 If 语句单独使用 console.log() 和 getElementById.click() 单独运行。但结合时不是。我正在尝试在谷歌应用脚本中重定向我的网络应用上的页面。

document.getElementById("login").addEventListener("click", submitL); //eventlistener for login 
function submitL() {
  var loginInfo = {}
  loginInfo.email = document.getElementById.("email").value;
  loginInfo.password = document.getElementById.("password").value;
  var ss = SpreadsheetApp.openById("15rUIxS8w53bvPZvTKuOdGw-ZP6eWMaykVJ26vqGBkEg");
  var ws = ss.getSheetByName("logindet");
  var loginList = ws.getRange(2, 1, ws.getLastRow() - 1, 3).getValues();
  var email = loginList.map(function (r) {
    return r[0]
  });

  var password = loginList.map(function (r) {
    return r[1]
  });

  var viewNameData = loginList.map(function (r) {
    return r[2]
  });
  var loginEmail = loginInfo.email;
  var loginPW = loginInfo.password;
  for (var i = 0; i < email.length; i++) {
    if ((loginEmail == email[i]) && (loginPW == password[i])) {
      document.getElementById("load").click();
    }
  }
}

【问题讨论】：

document.getElementById() 只能在您的客户端代码中调用。 SpreadsheetApp 只能在您的后端代码中调用。请查看client-to-server communications。
来自w3.org/TR/DOM-Level-2-HTML/html.html#ID-2651361 click Simulate a mouse-click. For INPUT elements whose type attribute has one of the following values: "button", "checkbox", "radio", "reset", or "submit". - 如果ID为load，那是什么样的元素？
如果我将电子表格应用程序移动到后端，如果语句为真，我如何重定向页面一次？
你好@Renier，你到底想做什么？似乎您正在尝试为自己的网站创建身份验证过程 - 但是，这似乎根本不安全。您可能想了解网络身份验证here...
我只是想在谷歌应用脚本中创建一个登录系统

标签： html google-apps-script web-applications login-script

【解决方案1】：

您需要拆分您的 Google Apps 脚本代码和您的客户端 Javascript 代码：

客户端 JavaScript 代码

document.getElementById("login").addEventListener("click", submitL); //eventlistener for login 

function submitL() {
  var loginInfo = {}
  loginInfo.email = document.getElementById.("email").value;
  loginInfo.password = document.getElementById.("password").value;

  var email = loginList.map(function (r) {
    return r[0]
  });

  var password = loginList.map(function (r) {
    return r[1]
  });

  var viewNameData = loginList.map(function (r) {
    return r[2]
  });
  var loginEmail = loginInfo.email;
  var loginPW = loginInfo.password;
  google.script.run.withSuccessHandler(onLoginResponse).logIn(loginEmail, loginPW);
}

function onLoginResponse(loggedIn) {
  if (loggedIn) {
    document.getElementById("load").click();
  } else {
    alert("Login unsuccessful, wrong credentials.");
  }
}

服务器端 Google Apps 脚本代码

function getLoginList() {
  var ss = SpreadsheetApp.openById("15rUIxS8w53bvPZvTKuOdGw-ZP6eWMaykVJ26vqGBkEg");
  var ws = ss.getSheetByName("logindet");
  return ws.getRange(2, 1, ws.getLastRow() - 1, 3).getValues();
}

function logIn(loginEmail, loginPW) {
  var loginList = getLoginList();
  for (var i=0; i<loginList.length; i++) {
    var row = loginList[i];
    if (loginEmail == row[0] && loginPW == row[1]) {
      // Found user
      return true;
    }
    return false;
  }
}

说明

SpreadsheetApp 无法从客户端访问，因此这种分离是必要的。在这种情况下，客户端请求服务器端运行logIn 函数，并带有loginEmail 和loginPW 参数。之后，它将处理该远程函数的响应。

google.script.run.withSuccessHandler(onLoginResponse).logIn(loginEmail, loginPW);

如果找到登录匹配，远程函数返回true，否则返回false。如果响应是肯定的，将执行document.getElementById("load").click(); 语句。

请记住，此应用程序仍然可能被“黑客入侵”，因为仍然可以执行该按钮单击，即从开发人员工具控制台。如果您担心安全性，我建议您了解并实施其他更安全的身份验证方法。

参考文献

您可以在此链接中了解有关 HTML Service 通信（前端和后端）的更多信息：https://developers.google.com/apps-script/guides/html/communication

【讨论】：