Question

我使用谷歌脚本实施了身份验证流程，但使用了来自username选项的password和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 Script：

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);
}

但它不起作用......

Answer 1

在原始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);
}

Google Script：从输入表单中获取值

1 个答案: