Nhúng Apps Script vào Website

1 Google Sheets Apps Script

Nhúng Apps Script vào Website Khi bạn tạo một ứng đụng Web app Script nhưng link ứng dụng quá dài, hay là có cảnh báo ứng dụng người dùng tạo, bạn muốn cá nhân hóa ứng dụng hơn;
Đồng thời bạn đang sở hữu một trang web và có ý tưởng chạy ứng dụng Web app script trên trang web của bản thân
Có một số cách để thực hiện điều đó là:
_ Gọi hàm Apps Script từ trang web (AppsScript chỉ cần code gs)
_ Nhúng toàn bộ Web app vào trang web (AppsScript cần cả code gs và html)
Trong bài viết này mình sẽ giới thiệu với mọi người theo cách nhúng Web app script vào trang web

Sử dụng phương thức XFrameOptionsMode trong đối tượng HtmlService
HtmlService được dùng để trả về HTML và nội dung văn bản khác từ một tập lệnh.
Các phương thức sử dụng

Phương thức	Mô tả
setXFrameOptionsMode(mode)	Đặt trạng thái của tiêu đề X-Frame-Options của trang, giúp kiểm soát tính năng ngăn chặn hành vi nhấp giả.

Các tham số trong mỗi phương thức

setXFrameOptionsMode(mode)

Tham số	Định dạng	Mô tả
mode	XFrameOptionsMode	Chế độ tuỳ chọn XFrame cần đặt.

Các thuộc tính XFrameOptionsMode params

Thuộc tính	Định dạng	Mô tả
ALLOWALL	Enum	Không đặt tiêu đề X-Frame-Options. Điều này sẽ cho phép mọi trang web tạo iframe cho trang Web app
DEFAULT	Enum	Đặt giá trị mặc định cho tiêu đề X-Frame-Options, giúp giữ nguyên các giả định bảo mật thông thường. Nếu một tập lệnh không đặt chế độ X-Frame-Options, thì Apps Script sẽ sử dụng chế độ này làm chế độ mặc định.

Xây dựng tập lệnh
_File Code.gs trong ứng dụng Web Apps Script



/*Nhúng Web Apps Script vào trang web - theza2.blogspot.com*/
function doGet() {
  /*Các câu lệnh khác
    ...
    ...*/
  return HtmlService.createHtmlOutputFromFile('Index') //Thay Index bằng tên file html trong ứng dụng của bạn
                    .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);//Cho phép Website khác có thể nhúng Web app
}

_File Index.html trong ứng dụng Web Apps Script



<!--Nhúng Web Apps Script vào trang web - theza2.blogspot.com-->
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
     XIN CHÀO!!!
     <!--Nội dung web app của bạn
     ...
     ...
     -->
  </body>
</html>

_Lệnh html trong trang web cần nhúng ứng dụng Apps Script



<!--Nhúng Web Apps Script vào trang web - theza2.blogspot.com-->
    <iframe width="100%"
               height="100%"
               frameborder="0"
               style="position:absolute;top:0;left:0;bottom:0;right:0; /*Chèn dòng này nếu bạn muốn bao phủ web app lên toàn bộ trang web*/"
               src="https://script.google.com/macros/s/idWepAppsScriptCủaBạn/exec">
    </iframe>