Google sheet App Script | Json Fetch data từ google sheet lên website

Giaoan.link chia sẻ đến các bạn Google sheet App Script  Json Fetch data từ google sheet lên website. Với project này các bạn dễ dàng kéo dữ liệu của mình từ google sheet lên website, blog. Dữ liệu dễ dàng cập nhật thông qua cập nhật trên google sheet. Dưới đây là code appscript và code trang html. Các bạn có thể xem thêm video hướng dẫn thông qua link dưới đây.

Code trang “Code.gs”

const ss = SpreadsheetApp.openByUrl("Paste your url spreadsheet")
const sheet = ss.getSheetByName("Sheet1")

function doGet(e){
  let obj = {};
  let data = sheet.getDataRange().getValues()
  obj.content = data;
  
return ContentService.createTextOutput(JSON.stringify(obj)).setMimeType(ContentService.MimeType.JSON)
}

Code html nơi bạn cần dữ liệu load lên

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	
    <title>Document</title>
    <style>
        table,tr {
            background-color: #fffc00;
	    border: solid 1px blue;
            border-collapse: collapse;
	padding: 10px;
        }   
        
	tr:nth-child(2n) {
            background-color: #ebfdc1;
	    border: 1px solid black;
            border-collapse: collapse;
padding: 10px;

        }

	td{
 	    border: 1px solid blue;
  	    border-collapse: collapse;
padding: 10px;

	}	
    </style>
</head>
<body>
    <table></table>
    <script>
        fetch('paste your url webapp')
            .then(res => res.json())
            .then(data => {
                let tr = data.content.reduce((prev, cur) => {
                    let td = cur.map(e => `<td>${e}</td>`)
                    return prev + `<tr>${td.join("")}</tr>`
                }, "\r")
                document.querySelector("table").innerHTML = tr;
                
            });

      setInterval(function() { window.location.reload();}, 20000);
    </script>
</body>
</html>