2016-06-08 2 views
0

Я реализовал процесс аутентификации с использованием сценариев google, но с жестко закодированными данными для username и password значениями от payload, и я не могу найти способ получить эти значения со страницы html, когда пользователь нажимает кнопку Login ...Google Script: получить значения из форм ввода

Есть ли способ получить эти значения от полей ввода до 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); 
} 

Но это не работает ...

+0

Не заставляйте тегов в заголовки. См. Http://stackoverflow.com/help/tagging –

ответ

1

В оригинальном HTML файл, который вы не пропуская ничего функции Логин() в вас .gs файл. Вы можете использовать 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> 

EDIT: функция Войти в гс файл

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

Что должна содержать эта функция '.withSuccessHandler (function (response)'? – Valip

+0

В вашей исходной функции входа ваша последняя строка - Logger.log (urlResponse). Если вы вернете это urlResponse, тогда он будет обрабатываться с помощью .withSuccessHandler(). Он становится переменной ответа в моем примере. –

+0

Когда я отлаживаю этот код в файле .gs, я получаю неопределенные значения в значениях 'email' и' password' из ' payload' – Valip

Смежные вопросы