Google sheet Apps script | Form đăng nhập chuyển hướng link cho mỗi user – Login form direct link

04/04/2024 giaoanppt

Giaoan.link chia sẻ đến các bạn project Google sheet Apps script “Form đăng nhập chuyển hướng link cho mỗi user – Login form direct link”. Với project này, mỗi khi user đăng nhập thành công sẽ được chuyển hướng sang một link khác. Mỗi user mỗi link. Dưới đây là code cùng video hướng dẫn.

Xem thêm nhiều project excel và apps script khác:

Code apps script trang “Code.gs”

//https://www.youtube.com/netmediaCCTV

function doGet() {
  return HtmlService.createTemplateFromFile('index')
  .evaluate()
  .addMetaTag('viewport', 'width=device-width, initial-scale=1')
  .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)
}
function loginData(username,password){                                 
  var ss = SpreadsheetApp.getActive().getSheetByName('Admin')
  var data = ss.getDataRange().getDisplayValues()
  var output = data.find(r=>r[0]+r[1] == username+password)
  return output
}

Code apps script trang “index.html”

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Netmedia CCTV</title>
  <script src="https://code.jquery.com/jquery-3.6.3.js"></script>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css" />
  <style>
    @import url('https://fonts.googleapis.com/css2?family=Arial&display=swap');
    *{
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: Arial, sans-serif;
    }
      </style>
</head>

<body>
  <div id="pageA">
    <div class="container my-3">
      <div class="col-md-6 mx-auto card shadow">
        <div class="card-body p-4">
          <h1 class="text-center"><i class="fa-solid fa-user-lock me-2"></i>Login</h1>
          <form id="myForm" onsubmit="login(this)">
            <div class="form-floating mb-3">
              <input type="text" class="form-control" id="username" placeholder="User Name" required>
              <label for="floatingInput"><i class="fa-solid fa-circle-user"></i> Username</label>
            </div>
            <div class="form-floating mb-3">
              <input type="password" class="form-control" id="password" placeholder="Password" required>
              <label for="floatingPassword"><i class="fa-solid fa-lock"></i> Password</label>
            </div>
            <button type="submit" class="btn btn-primary btn-lg w-100"><i class="fa-solid fa-right-to-bracket me-2"></i>Login</button>
          </form>
        </div>
      </div>
    </div>
  </div>

 <div class="copyright mb-3"></div>
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> 
  <?!= HtmlService.createHtmlOutputFromFile('js').getContent() ?>
</body>
</html>

Code apps script trang “js.html”


<script>
  window.onload = ()=>{    
    setFooter()
  }  
     
  	function login(){
      event.preventDefault()
      let username = document.getElementById("username").value
      let password = document.getElementById("password").value
         Swal.fire({
            position: 'top',
            icon: 'info',
            title: 'Loading...',
            showConfirmButton: false,
          })
          Swal.showLoading()
            google.script.run.withSuccessHandler((dataArray)=>{
          if(dataArray !== null){
               //console.log(dataArray)
           Swal.fire({
              position: 'top',
              icon: 'success',
              title: 'Success',
              showConfirmButton: false,
              timer: 1500
            }) 
              
              window.location.href= dataArray[4];  
           
              }else{
                Swal.fire({
                position: 'top',
                icon: 'error',
                title: 'Không tìm thấy thông tin!!',
                showConfirmButton: false,
                timer: 1500
              })
              }
          }).loginData(username,password);
          }
      

  function setFooter(){
  document.querySelector('.copyright').innerHTML = '<div class="text-center"><a href="https://www.youtube.com/netmediacctv" target="_blank"><i style="color:red" class="fa-brands fa-youtube fa-2x"></i></a><a href="https://www.facebook.com/giaoanppt" target="_blank"><i class="fa-brands fa-facebook fa-2x"></i></a></div><center style="font-size:12px;"><a style="color:gray;text-decoration:none" href="https://giaoan.link" target="_blank"> Giaoan.link<a/> &copy; 2024 Chia sẻ tài liệu Giáo viên</center>'
  }
	</script>

XEM VIDEO HƯỚNG DẪN