ใช้ออบเจ็กต์ Action เพื่อสร้างลักษณะการทำงานแบบโต้ตอบในส่วนเสริมของ Google Workspace
ออบเจ็กต์การดำเนินการจะกำหนดสิ่งที่เกิดขึ้นเมื่อผู้ใช้โต้ตอบกับวิดเจ็ต (เช่น ปุ่ม) ใน UI ของส่วนเสริม
เพิ่มการดำเนินการไปยังวิดเจ็ต
หากต้องการแนบการดำเนินการกับวิดเจ็ต ให้ใช้ ฟังก์ชันตัวแฮนเดิลวิดเจ็ต ซึ่งยังกำหนดเงื่อนไขที่ทริกเกอร์การดำเนินการด้วย เมื่อทริกเกอร์แล้ว การดำเนินการจะเรียกใช้ฟังก์ชัน Callback ที่กำหนด ฟังก์ชันเรียกกลับจะส่งออบเจ็กต์เหตุการณ์ที่มี ข้อมูลเกี่ยวกับการโต้ตอบฝั่งไคลเอ็นต์ของผู้ใช้ คุณต้องใช้ ฟังก์ชันเรียกกลับและให้ฟังก์ชันดังกล่าวแสดงผลออบเจ็กต์การตอบกลับที่เฉพาะเจาะจง
ตัวอย่าง: แสดงการ์ดใหม่เมื่อคลิกปุ่ม
หากต้องการเพิ่มปุ่มลงในส่วนเสริมที่จะสร้าง และแสดงการ์ดใหม่เมื่อคลิก ให้ทำตามขั้นตอนต่อไปนี้
- สร้างวิดเจ็ตปุ่ม
- หากต้องการตั้งค่าการดำเนินการสร้างการ์ด ให้เพิ่มฟังก์ชันตัวแฮนเดิลวิดเจ็ตปุ่ม
setOnClickAction - สร้างฟังก์ชัน Callback ของ Apps Script เพื่อดำเนินการและระบุเป็น
actionภายในฟังก์ชันตัวแฮนเดิลวิดเจ็ต ในกรณีนี้ ฟังก์ชัน Callback ควรสร้างการ์ดที่คุณต้องการและส่งคืนออบเจ็กต์ActionResponseออบเจ็กต์การตอบกลับจะบอกให้ส่วนเสริมแสดงการ์ดที่ฟังก์ชัน Callback สร้างขึ้น
ตัวอย่างต่อไปนี้แสดงการสร้างวิดเจ็ตปุ่ม การดำเนินการ
ขอขอบเขต drive.file สำหรับไฟล์ปัจจุบันในนามของ
ส่วนเสริม
/**
* Adds a section to the Card Builder that displays a "REQUEST PERMISSION"
* button. When it's clicked, the callback triggers file scope permission flow.
* This is used in the add-on when the home-page displays basic data.
*/
function addRequestFileScopeButtonToBuilder(cardBuilder) {
var buttonSection = CardService.newCardSection();
// If the add-on does not have access permission, add a button that
// lets the user provide that permission on a per-file basis.
var buttonAction = CardService.newAction()
.setFunctionName("onRequestFileScopeButtonClickedInEditor");
var button = CardService.newTextButton()
.setText("Request permission")
.setBackgroundColor("#4285f4")
.setTextButtonStyle(CardService.TextButtonStyle.FILLED)
.setOnClickAction(buttonAction);
buttonSection.addWidget(button);
cardBuilder.addSection(buttonSection);
}
/**
* Callback function for a button action. Instructs Docs to display a
* permissions dialog to the user, requesting `drive.file` scope for the
* current file on behalf of this add-on.
*
* @param {Object} e The parameters object that contains the document's ID
* @return {editorFileScopeActionResponse}
*/
function onRequestFileScopeButtonClickedInEditor(e) {
return CardService.newEditorFileScopeActionResponseBuilder()
.requestFileScopeForActiveDocument().build();
}
การโต้ตอบการเข้าถึงไฟล์สำหรับ REST API
ส่วนเสริม Google Workspace ที่ขยายเครื่องมือแก้ไขและใช้ REST API สามารถรวม การดำเนินการวิดเจ็ตเพิ่มเติมเพื่อขอสิทธิ์เข้าถึงไฟล์ได้ การดำเนินการนี้ต้องใช้ฟังก์ชัน Callback ของการดำเนินการที่เชื่อมโยงเพื่อแสดงออบเจ็กต์การตอบกลับเฉพาะทาง
| การดำเนินการที่พยายาม | ฟังก์ชัน Callback ควรแสดงผล |
|---|---|
| ขอสิทธิ์เข้าถึงไฟล์ | EditorFileScopeActionResponse |
หากต้องการใช้ประโยชน์จากออบเจ็กต์การดำเนินการและการตอบกลับของวิดเจ็ตนี้ เงื่อนไขต่อไปนี้ทั้งหมดต้องเป็นจริง
- ส่วนเสริมใช้ REST API
- ส่วนเสริมจะแสดงกล่องโต้ตอบขอบเขตไฟล์คำขอ
โดยใช้เมธอด
CardService.newEditorFileScopeActionResponseBuilder().requestFileScopeForActiveDocument().build(); - โดยส่วนเสริมจะมี
https://www.googleapis.com/auth/drive.fileขอบเขตของเอดิเตอร์และonFileScopeGrantedทริกเกอร์ในไฟล์ Manifest
ขอสิทธิ์เข้าถึงไฟล์สำหรับเอกสารปัจจุบัน
หากต้องการขอสิทธิ์เข้าถึงไฟล์สำหรับเอกสารปัจจุบัน ให้ทำตามขั้นตอนต่อไปนี้
- สร้างการ์ดหน้าแรกที่ตรวจสอบว่าส่วนเสริมมี
drive.fileขอบเขตหรือไม่ - ในกรณีที่ส่วนเสริมไม่ได้รับ
drive.fileขอบเขต ให้สร้างวิธีขอให้ผู้ใช้ให้drive.fileขอบเขตสำหรับเอกสารปัจจุบัน
ตัวอย่าง: รับสิทธิ์เข้าถึงเอกสารปัจจุบันในเอกสาร
ตัวอย่างต่อไปนี้สร้างอินเทอร์เฟซสำหรับเอกสารที่แสดง
ขนาดของเอกสารปัจจุบัน หากส่วนเสริมไม่มีdrive.fileการให้สิทธิ์ จะแสดงปุ่มเพื่อเริ่มการให้สิทธิ์ขอบเขตไฟล์
/**
* Build a card that checks selected items' quota usage. Checking
* quota usage requires user-permissions, so this add-on provides a button
* to request `drive.file` scope for items the add-on doesn't yet have
* permission to access.
*
* @param e The event object passed containing information about the
* current document.
* @return {Card}
*/
function onDocsHomepage(e) {
return createAddOnView(e);
}
function onFileScopeGranted(e) {
return createAddOnView(e);
}
/**
* For the current document, display either its quota information or
* a button that lets the user provide permission to access that
* file to retrieve its quota details.
*
* @param e The event containing information about the current document
* @return {Card}
*/
function createAddOnView(e) {
var docsEventObject = e['docs'];
var builder = CardService.newCardBuilder();
var cardSection = CardService.newCardSection();
if (docsEventObject['addonHasFileScopePermission']) {
cardSection.setHeader(docsEventObject['title']);
// This add-on uses the recommended, limited-permission `drive.file`
// scope to get granular per-file access permissions.
// See: https://developers.google.com/drive/api/v2/about-auth
// If the add-on has access permission, read and display its quota.
cardSection.addWidget(
CardService.newTextParagraph().setText(
"This file takes up: " +
getQuotaBytesUsed(docsEventObject['id'])));
} else {
// If the add-on does not have access permission, add a button that
// lets the user provide that permission on a per-file basis.
cardSection.addWidget(
CardService.newTextParagraph().setText(
"The add-on needs permission to access this file's quota."));
var buttonAction = CardService.newAction()
.setFunctionName("onRequestFileScopeButtonClicked");
var button = CardService.newTextButton()
.setText("Request permission")
.setOnClickAction(buttonAction);
cardSection.addWidget(button);
}
return builder.addSection(cardSection).build();
}
/**
* Callback function for a button action. Instructs Docs to
* display a permissions dialog to the user, requesting `drive.file` scope for
* the current file on behalf of this add-on.
*
* @param {Object} e The parameters object that contains the document's ID
* @return {editorFileScopeActionResponse}
*/
function onRequestFileScopeButtonClicked(e) {
return CardService.newEditorFileScopeActionResponseBuilder()
.requestFileScopeForActiveDocument().build();
}