HTML에 Java 스크립트 결과가 표시되지 않음

Nov 30 2020

나는 직원이 있는지 확인하기 위해 가스 코드를 작성 에서하거나하지 (구글 시트에서 데이터를 추출)에. 콘솔 로그는 정답을 제공하지만 버튼을 클릭하면 답변이 프런트 엔드에 나타나지 않습니다. 내가 어디에서 잘못되었는지 문제를 해결하도록 도와 줄 수 있습니까?

<div>
<script>
 function onStatus(notify) { 
 
 var employee = "John Peter";
 
 var ss = SpreadsheetApp.getActiveSpreadsheet();        
 var mainSheet = ss.getSheetByName("MAIN");
 var data = mainSheet.getDataRange().getValues();
 
 
   for (var j = 0; j < data.length; j++){
    var row = data[j];
    var mainSheet2 = row[4];
    var mainSheet3 = row[0];
    var status = (mainSheet2 =="IN" && mainSheet3 == employee) ; 
    if (status == true){
      var notify = employee +" You Are In"
      
      return notify;
 
  }
      }
document.getElementById('status').innerHTML= notify;       
      }
     
    </script>
<button onclick="onStatus()">Check Status</button>

 <font color='Green' id="status" ></font>
</div>

답변

4 Diego Nov 30 2020 at 10:49

Google은 이것이 어떻게 작동하는지 더 잘 이해하기 위해 읽어 보시기를 적극 권장 하는 매우 훌륭한 클라이언트-서버 통신 가이드 를 제공합니다.

SpreadsheetApp.getActiveSpreadsheet()프런트 엔드 스크립트 에 앱 스크립트 코드 (예 :)를 넣을 수 없습니다 . 이 코드는 백엔드의 앱 스크립트 서버에서 실행해야하며 그런 다음 호출을 사용하여 google.script.run호출합니다.

Code.gs

function doGet(e) {
  return HtmlService.createHtmlOutputFromFile('Index');
}

function checkStatus() { 
  var employee = "John Peter";
  var ss = SpreadsheetApp.getActiveSpreadsheet();        
  var mainSheet = ss.getSheetByName("MAIN");
  var data = mainSheet.getDataRange().getValues();
  
  for (var j = 0; j < data.length; j++){
    var row = data[j];
    var mainSheet2 = row[4];
    var mainSheet3 = row[0];
    var status = (mainSheet2 =="IN" && mainSheet3 == employee) ; 
    if (status == true){
      return employee + " You Are In";
    }
  }
}

Index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <div>
      <button onclick="onStatus()">Check Status</button>
      <font color='Green' id="status" ></font>
    </div>

    <script>
      function onStatus() {
        google.script.run
          .withSuccessHandler(updateStatus) // Send the backend result to updateStatus()
          .checkStatus(); // Call the backend function
      }
  
      function updateStatus(notify) {
        document.getElementById('status').innerHTML= notify;
      }
    </script>
  </body>
</html>