Class HtmlOutput

เอาต์พุต HTML

ออบเจ็กต์ HtmlOutput ที่แสดงจากสคริปต์ได้ เนื่องด้วยเหตุผลด้านความปลอดภัย สคริปต์จะส่ง HTML กลับไปยังเบราว์เซอร์โดยตรงไม่ได้ แต่จะต้องทําความสะอาดอุปกรณ์เพื่อให้ ดําเนินการที่เป็นอันตรายไม่ได้ คุณสามารถส่งคืน HTML ที่ปลอดภัย เช่น 

function doGet() {
  return HtmlService.createHtmlOutput('<b>Hello, world!</b>');
}
โค้ดใน HtmlOutput อาจมี JavaScript และ CSS แบบฝัง (ซึ่งเป็น JavaScript ฝั่งไคลเอ็นต์มาตรฐานที่จัดการ DOM ไม่ใช่ Apps Script) เนื้อหาทั้งหมดเป็นแบบแซนด์บ็อกซ์โดยใช้แซนด์บ็อกซ์ของ iframe สําหรับข้อมูลเพิ่มเติม โปรดดูคู่มือข้อจํากัดในบริการ HTML

เมธอด

วิธีการประเภทการแสดงผลรายละเอียดแบบย่อ
addMetaTag(name, content)HtmlOutputเพิ่มเมตาแท็กลงในหน้าเว็บ
append(addedContent)HtmlOutputเพิ่มเนื้อหาใหม่ต่อท้ายเนื้อหาของ HtmlOutput นี้
appendUntrusted(addedContent)HtmlOutputเพิ่มเนื้อหาใหม่ต่อท้ายเนื้อหาของ HtmlOutput นี้ โดยใช้ Escape ตามบริบท
asTemplate()HtmlTemplateแสดง HtmlTemplate ที่สนับสนุนโดย HtmlOutput นี้
clear()HtmlOutputล้างเนื้อหาปัจจุบัน
getAs(contentType)Blobส่งคืนข้อมูลภายในออบเจ็กต์นี้เป็น BLOB ที่แปลงเป็นประเภทเนื้อหาที่ระบุ
getBlob()Blobส่งคืนข้อมูลภายในออบเจ็กต์นี้เป็น BLOB
getContent()Stringรับเนื้อหาของ HtmlOutput นี้
getFaviconUrl()Stringรับ URL สําหรับแท็กลิงก์ไอคอน Fav ที่เพิ่มลงในหน้าโดยการโทรหา setFaviconUrl(iconUrl)
getHeight()Integerรับข้อมูลความสูงเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม
getMetaTags()HtmlOutputMetaTag[]รับอาร์เรย์ของออบเจ็กต์ซึ่งแสดงเมตาแท็กที่เพิ่มลงในหน้าเว็บโดยการเรียกใช้ addMetaTag(name, content)
getTitle()Stringรับชื่อหน้าเอาต์พุต
getWidth()Integerรับความกว้างเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม
setContent(content)HtmlOutputตั้งค่าเนื้อหาของ HtmlOutput นี้
setFaviconUrl(iconUrl)HtmlOutputเพิ่มแท็กลิงก์สําหรับไอคอน Fav ในหน้าเว็บ
setHeight(height)HtmlOutputตั้งค่าความสูงเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม
setSandboxMode(mode)HtmlOutputวิธีการนี้จะไม่มีผล ก่อนหน้านี้คุณจะตั้งค่า sandbox mode ที่ใช้สําหรับสคริปต์ฝั่งไคลเอ็นต์
setTitle(title)HtmlOutputตั้งชื่อหน้าเอาต์พุต
setWidth(width)HtmlOutputตั้งค่าความกว้างเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม
setXFrameOptionsMode(mode)HtmlOutputตั้งค่าสถานะของส่วนหัว X-Frame-Options ของหน้าเว็บ ซึ่งจะควบคุมการป้องกันการหลอกให้คลิก

เอกสารประกอบโดยละเอียด

addMetaTag(name, content)

เพิ่มเมตาแท็กลงในหน้าเว็บ เมตาแท็กที่อยู่ในไฟล์ HTML ของ Apps Script โดยตรง จะไม่ประมวลผล มีเฉพาะเมตาแท็กต่อไปนี้ 

<meta name="apple-mobile-web-app-capable" content="..."/>
<meta name="google-site-verification" content="..."/>
<meta name="mobile-web-app-capable" content="..."/>
<meta name="viewport" content="..."/>
var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.addMetaTag('viewport', 'width=device-width, initial-scale=1');

พารามิเตอร์

ชื่อประเภทคำอธิบาย
nameStringค่าของแอตทริบิวต์ชื่อเมตาแท็ก
contentStringค่าของแอตทริบิวต์เนื้อหาเมตาแท็ก

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

append(addedContent)

เพิ่มเนื้อหาใหม่ต่อท้ายเนื้อหาของ HtmlOutput นี้ ใช้ตัวเลือกนี้เฉพาะกับเนื้อหาจากแหล่งที่มาที่เชื่อถือ เนื่องจากจะไม่มีการ Escape 

// Log "<b>Hello, world!</b><p>Hello again, world.</p>"
var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.append('<p>Hello again, world.</p>');
Logger.log(output.getContent());

พารามิเตอร์

ชื่อประเภทคำอธิบาย
addedContentStringเนื้อหาที่จะต่อท้าย

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

ผ้าคลุม

Error — หาก HTML มีรูปแบบไม่ถูกต้อง

ดูเพิ่มเติม

appendUntrusted(addedContent)

เพิ่มเนื้อหาใหม่ต่อท้ายเนื้อหาของ HtmlOutput นี้ โดยใช้ Escape ตามบริบท

เมธอดนี้ใช้ Escape เนื้อหาตามสถานะปัจจุบันของ HtmlOutput อย่างถูกต้องเพื่อให้ผลลัพธ์เป็นสตริงที่ปลอดภัยและไม่ใช้มาร์กอัปหรือผลกระทบ ใช้วิธีนี้แทนการใช้ปลายทางเมื่อคุณเพิ่มเนื้อหาจากแหล่งที่มาที่ไม่น่าเชื่อถือ เช่น จากผู้ใช้ เพื่อหลีกเลี่ยงข้อบกพร่องข้อบกพร่องของการเขียนสคริปต์ข้ามเว็บไซต์ (XSS) ซึ่งเนื้อหาหรือมาร์กอัปที่คุณใส่ต่อท้ายทําให้เกิดการเรียกใช้โค้ดที่ไม่คาดคิด 

// Log "<b>Hello, world!</b>&lt;p&gt;Hello again, world.&lt;/p&gt;"
var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.appendUntrusted('<p>Hello again, world.</p>');
Logger.log(output.getContent());

พารามิเตอร์

ชื่อประเภทคำอธิบาย
addedContentStringเนื้อหาที่จะต่อท้าย

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

ผ้าคลุม

Error — หาก HTML มีรูปแบบไม่ถูกต้องมาก

ดูเพิ่มเติม

asTemplate()

แสดง HtmlTemplate ที่สนับสนุนโดย HtmlOutput นี้ วิธีการนี้สามารถใช้ สร้างเทมเพลตเพิ่มขึ้นทีละน้อย การเปลี่ยนแปลง HtmlOutput ในอนาคตจะส่งผลต่อเนื้อหาของ HtmlTemplate ด้วยเช่นกัน 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
var template = output.asTemplate();

ไปกลับ

HtmlTemplate — HtmlTemplate ใหม่

clear()

ล้างเนื้อหาปัจจุบัน 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.clear();

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

getAs(contentType)

ส่งคืนข้อมูลภายในออบเจ็กต์นี้เป็น BLOB ที่แปลงเป็นประเภทเนื้อหาที่ระบุ เมธอดนี้จะเพิ่มส่วนขยายที่เหมาะสมไปยังชื่อไฟล์ เช่น "myfile.pdf" อย่างไรก็ตาม สมมติว่าส่วนของชื่อไฟล์ที่อยู่หลังเครื่องหมายจุด (หากมี) เป็นส่วนขยายที่มีอยู่ซึ่งควรแทนที่ &"ShoppingList.12.25.2014" เป็น "ShoppingList.12.25.pdf"

หากต้องการดูโควต้ารายวันของ Conversion โปรดดูโควต้าสําหรับบริการของ Google โดเมน Google Workspace ที่สร้างใหม่อาจมีโควต้าที่ตายตัวเป็นการชั่วคราว

พารามิเตอร์

ชื่อประเภทคำอธิบาย
contentTypeStringประเภท MIME ที่จะแปลงเป็น สําหรับ Blob ส่วนใหญ่ 'application/pdf' เป็นตัวเลือกเดียวที่ใช้ได้ สําหรับรูปภาพในรูปแบบ BMP, GIF, JPEG หรือ PNG จะใช้ 'image/bmp', 'image/gif', 'image/jpeg' หรือ 'image/png' ได้เช่นกัน

ไปกลับ

Blob — ข้อมูลในรูปแบบ BLOB

getBlob()

ส่งคืนข้อมูลภายในออบเจ็กต์นี้เป็น BLOB

ไปกลับ

Blob — ข้อมูลในรูปแบบ BLOB

getContent()

รับเนื้อหาของ HtmlOutput นี้ 

// Log "<b>Hello, world!</b>"
var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
Logger.log(output.getContent());

ไปกลับ

String — เนื้อหาที่แสดง

getFaviconUrl()

รับ URL สําหรับแท็กลิงก์ไอคอน Fav ที่เพิ่มลงในหน้าโดยการโทรหา setFaviconUrl(iconUrl) และระบบจะไม่สนใจแท็กลิงก์ไอคอน Fav ที่มีอยู่ในไฟล์ HTML ของ Apps Script โดยตรง 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setFaviconUrl('http://www.example.com/image.png');
Logger.log(output.getFaviconUrl());

ไปกลับ

String — URL ของรูปภาพไอคอน Fav

getHeight()

รับข้อมูลความสูงเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม หากมีการเผยแพร่ HtmlOutput เป็นเว็บแอปแทน เมธอดนี้จะแสดงผล null หากต้องการปรับขนาดกล่องโต้ตอบที่เปิดอยู่แล้ว ให้เรียกใช้ google.script.host.setHeight(height) ในโค้ดฝั่งไคลเอ็นต์ 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setHeight(200);
Logger.log(output.getHeight());

ไปกลับ

Integer — ความสูงเป็นพิกเซล

getMetaTags()

รับอาร์เรย์ของออบเจ็กต์ซึ่งแสดงเมตาแท็กที่เพิ่มลงในหน้าเว็บโดยการเรียกใช้ addMetaTag(name, content) เมตาแท็กที่อยู่ในไฟล์ HTML ของ Apps Script โดยตรง จะไม่ประมวลผล 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.addMetaTag('viewport', 'width=device-width, initial-scale=1');

var tags = output.getMetaTags();
Logger.log('<meta name="%s" content="%s"/>', tags[0].getName(), tags[0].getContent());

ไปกลับ

HtmlOutputMetaTag[] — อาร์เรย์ของออบเจ็กต์ที่แสดงเมตาแท็กที่เพิ่มลงในหน้าโดยการเรียกใช้ addMetaTag(name, content)

getTitle()

รับชื่อหน้าเอาต์พุต โปรดทราบว่าระบบจะไม่สนใจองค์ประกอบ <title> HTML 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
Logger.log(output.getTitle());

ไปกลับ

String — ชื่อของหน้า

getWidth()

รับความกว้างเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม หากมีการเผยแพร่ HtmlOutput เป็นเว็บแอปแทน เมธอดนี้จะแสดงผล null หากต้องการปรับขนาดกล่องโต้ตอบที่เปิดอยู่แล้ว ให้เรียกใช้ google.script.host.setWidth(width) ในโค้ดฝั่งไคลเอ็นต์ 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setWidth(200);
Logger.log(output.getWidth());

ไปกลับ

Integer — ความกว้างเป็นพิกเซล

setContent(content)

ตั้งค่าเนื้อหาของ HtmlOutput นี้ 

var output = HtmlService.createHtmlOutput();
output.setContent('<b>Hello, world!</b>');

พารามิเตอร์

ชื่อประเภทคำอธิบาย
contentStringเนื้อหาที่จะแสดง

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

ผ้าคลุม

Error — หาก HTML มีรูปแบบไม่ถูกต้อง

setFaviconUrl(iconUrl)

เพิ่มแท็กลิงก์สําหรับไอคอน Fav ในหน้าเว็บ ระบบจะไม่สนใจแท็กลิงก์ไอคอน Fav ที่มีอยู่ในไฟล์ HTML Apps Script โดยตรง 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setFaviconUrl('http://www.example.com/image.png');

พารามิเตอร์

ชื่อประเภทคำอธิบาย
iconUrlStringURL ของรูปภาพไอคอน Fav โดยมีส่วนขยายรูปภาพซึ่งระบุประเภทรูปภาพ

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

setHeight(height)

ตั้งค่าความสูงเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม หากมีการเผยแพร่ HtmlOutput เป็นเว็บแอปแทน วิธีนี้จะไม่มีผล หากต้องการปรับขนาดกล่องโต้ตอบที่เปิดอยู่แล้ว ให้เรียกใช้ google.script.host.setHeight(height) ในโค้ดฝั่งไคลเอ็นต์ 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setHeight(200);

พารามิเตอร์

ชื่อประเภทคำอธิบาย
heightIntegerความสูงเป็นพิกเซลใหม่ null ทําให้เป็นค่าเริ่มต้น

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

setSandboxMode(mode)

วิธีการนี้จะไม่มีผล ก่อนหน้านี้คุณจะตั้งค่า sandbox mode ที่ใช้สําหรับสคริปต์ฝั่งไคลเอ็นต์ เพื่อป้องกันไม่ให้ผู้ใช้ได้รับ HTML หรือ JavaScript ที่เป็นอันตราย โค้ดฝั่งไคลเอ็นต์ที่แสดงจากบริการ HTML จะดําเนินการในแซนด์บ็อกซ์ความปลอดภัยที่แสดงข้อจํากัดเกี่ยวกับโค้ด เดิมทีวิธีนี้จะทําให้ผู้เขียนสคริปต์สามารถเลือกระหว่างแซนด์บ็อกซ์เวอร์ชันต่างๆ ได้ แต่ตอนนี้สคริปต์ทั้งหมดใช้โหมด IFRAME ไม่ว่าจะตั้งค่าโหมดแซนด์บ็อกซ์ไว้แบบใดก็ตาม สําหรับข้อมูลเพิ่มเติม โปรดดูคู่มือข้อจํากัดในบริการ HTML

โหมด IFRAME มีข้อจํากัดน้อยกว่าโหมดแซนด์บ็อกซ์อื่นๆ มากและทํางานได้เร็วขึ้น แต่ใช้งานไม่ได้เลยในบางเบราว์เซอร์เวอร์ชันเก่า รวมถึง Internet Explorer อ่านโหมดแซนด์บ็อกซ์ในสคริปต์ฝั่งไคลเอ็นต์ได้โดยตรวจสอบ google.script.sandbox.mode โปรดทราบว่าพร็อพเพอร์ตี้นี้แสดงโหมดจริงในไคลเอ็นต์ ซึ่งอาจแตกต่างจากโหมดที่ขอในเซิร์ฟเวอร์หากโหมดของผู้ใช้ไม่รองรับเบราว์เซอร์ที่ขอ 

<!-- Read the sandbox mode (in a client-side script). -->
<script>
  alert(google.script.sandbox.mode);
</script>

พารามิเตอร์

ชื่อประเภทคำอธิบาย
modeSandboxModeโหมดแซนด์บ็อกซ์ที่จะใช้

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

setTitle(title)

ตั้งชื่อหน้าเอาต์พุต สําหรับเว็บแอป นี่คือชื่อหน้าเว็บทั้งหน้า ส่วน HtmlOutput ที่แสดงใน Google ชีตจะเป็นชื่อของกล่องโต้ตอบ 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setTitle('My First Page');

พารามิเตอร์

ชื่อประเภทคำอธิบาย
titleStringชื่อใหม่

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

setWidth(width)

ตั้งค่าความกว้างเริ่มต้นของกล่องโต้ตอบที่กําหนดเองใน Google เอกสาร ชีต หรือฟอร์ม หากมีการเผยแพร่ HtmlOutput เป็นเว็บแอปแทน วิธีนี้จะไม่มีผล หากต้องการปรับขนาดกล่องโต้ตอบที่เปิดอยู่แล้ว ให้เรียกใช้ google.script.host.setWidth(width) ในโค้ดฝั่งไคลเอ็นต์ 

var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setWidth(200);

พารามิเตอร์

ชื่อประเภทคำอธิบาย
widthIntegerความกว้างใหม่เป็นพิกเซล และ null จะทําให้เป็นค่าเริ่มต้น

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ

setXFrameOptionsMode(mode)

ตั้งค่าสถานะของส่วนหัว X-Frame-Options ของหน้าเว็บ ซึ่งจะควบคุมการป้องกันการหลอกให้คลิก

การตั้งค่า XFrameOptionsMode.ALLOWALL จะทําให้ iframe ของทุกเว็บไซต์มีหน้าเว็บนั้น ดังนั้นนักพัฒนาซอฟต์แวร์ควรใช้การป้องกันการหลอกให้คลิกด้วยตนเอง

หากสคริปต์ไม่ได้ตั้งค่าโหมด X-Frame-Options ไว้ Apps Script จะใช้โหมด XFrameOptionsMode.DEFAULT เป็นค่าเริ่มต้น 

// Serve HTML with no X-Frame-Options header (in Apps Script server-side code).
var output = HtmlService.createHtmlOutput('<b>Hello, world!</b>');
output.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);

พารามิเตอร์

ชื่อประเภทคำอธิบาย
modeXFrameOptionsModeโหมดตัวเลือก XFrame ที่จะตั้งค่า

ไปกลับ

HtmlOutput — เอาต์พุตนี้สําหรับเชนธุรกิจ