Google sheet App script Webapp | Đếm số lượt truy cập trang và ghi vào sheet – Count visit page

giaoanppt

10 tháng trước

Trong bài này, giaoan.link cùng bạn tạo một project về Google sheet App script Webapp – Đếm số lượt truy cập trang và ghi vào sheet (Count visit page). Khi trang web hay ứng dụng webapp của bạn có một lượt truy cập thì giá trị sẽ ghi nhận và truyền về lưu trữ trên sheet của google sheet. Dưới đây là code apps script tham khảo và video hướng dẫn.

Một bài về tạo button like và hiển thị số lượt like trang, bạn tham khảo: tại đây

Code của trang “Code.gs”

function doGet() {
  return HtmlService.createTemplateFromFile('Index').evaluate()
  .setTitle("countPage")
  .addMetaTag('viewport','width=device-width, initial-scale=1')
  .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)
}

function countPage(){
  var ss = SpreadsheetApp.getActive().getSheetByName('Data')  

  var countP = ss.getRange('B2').getValue()

  countP++

  ss.getRange('B2').setValue(countP)

  return countP
}

Code trang “Index.html”

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Count visit page</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
  </head>
  <body>
    <h1 class="text-center" style="color:red">CHÀO BẠN ĐẾN KÊNH THÔNG TIN CỦA MÌNH!</h1>
    <h4 class="text-center" style="color:blue">Bạn truy cập kênh youtube của mình tại: <a href="https://youtube.com/netmediacctv" target="_blank">Youtube.com/NetmediaCCTV</a></h4>
    <h4 class="text-center" style="color:blue">Trang web chia sẻ tài liệu: <a href="https://giaoan.link" target="_blank">Giaoan.link</a></h4>
    
    <hr>

    <div class="text-center my-4">
      <h5>Page views: <span id="countP"></span> </h5>
    </div>

        <script>
      window.onload = ()=>{
        google.script.run.withSuccessHandler(data=>{
          document.getElementById('countP').innerText = data
        }).countPage()
      }
    </script>
    
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
  </body>
</html>

Code của trang “Code.gs”

Code trang “Index.html”

Video hướng dẫn thực hành