API การแจ้งเตือนแบบริชมีเดีย

ความแตกต่างของแพลตฟอร์ม: ใน Chrome เวอร์ชัน 59 การแจ้งเตือนจะปรากฏต่างออกไปสำหรับผู้ใช้ Mac OS X ผู้ใช้จะเห็นการแจ้งเตือนของ Mac OS X แบบเนทีฟแทนการแจ้งเตือนของ Chrome ดูข้อมูลเพิ่มเติมในบทความนี้

API การแจ้งเตือนที่สมบูรณ์ช่วยให้คุณสามารถสร้างการแจ้งเตือนโดยใช้เทมเพลต และแสดงการแจ้งเตือนเหล่านี้ การแจ้งเตือนถึงผู้ใช้ในถาดระบบของผู้ใช้:

การแจ้งเตือนในถาดผู้ใช้ระบบ

ลักษณะที่ปรากฏ

การแจ้งเตือนที่สมบูรณ์มี 4 ประเภท ได้แก่ พื้นฐาน รูปภาพ รายการ และความคืบหน้า ทั้งหมด การแจ้งเตือนมีชื่อ ข้อความ ไอคอนขนาดเล็กที่แสดงทางด้านซ้ายของการแจ้งเตือน และฟิลด์ ContextMessage ซึ่งแสดงเป็นฟิลด์ข้อความที่ 3 ในแบบอักษรสีอ่อน

รูปภาพพื้นฐาน:

การแจ้งเตือนพื้นฐาน

การแจ้งเตือนแบบรายการจะแสดงจำนวนรายการดังต่อไปนี้

การแจ้งเตือนในรายการ

การแจ้งเตือนรูปภาพจะมีตัวอย่างรูปภาพ ดังนี้

การแจ้งเตือนรูปภาพ

การแจ้งเตือนความคืบหน้าจะแสดงแถบความคืบหน้าดังนี้

การแจ้งเตือนความคืบหน้า

กลุ่มเป้าหมายมีพฤติกรรมอย่างไร

ใน ChromeOS การแจ้งเตือนจะแสดงในถาดระบบของผู้ใช้ และอยู่ในถาดระบบจนกว่า ผู้ใช้ปิดโฆษณา ถาดระบบจะนับจำนวนการแจ้งเตือนใหม่ทั้งหมด เมื่อผู้ใช้เห็น ในถาดระบบ จำนวนจะรีเซ็ตเป็น 0

คุณสามารถกำหนดลำดับความสำคัญของการแจ้งเตือนได้ตั้งแต่ -2 ถึง 2 ลำดับความสำคัญ < 0 จะแสดงใน ChromeOS ศูนย์การแจ้งเตือน และสร้างข้อผิดพลาดในแพลตฟอร์มอื่นๆ ลำดับความสำคัญ 0 คือลำดับความสำคัญเริ่มต้น ลำดับความสำคัญ > 0 จะแสดงเพื่อเพิ่มระยะเวลา และสามารถอาจแสดงการแจ้งเตือนที่มีลำดับความสำคัญสูง แสดงในถาดระบบ

นอกจากการแสดงข้อมูลแล้ว ประเภทการแจ้งเตือนทั้งหมดจะมีรายการการทำงานได้สูงสุด 2 รายการ เมื่อผู้ใช้คลิกรายการการทำงาน แอปจะตอบสนองด้วยการดำเนินการที่เหมาะสมได้ ตัวอย่างเช่น เมื่อผู้ใช้คลิก "ตอบกลับ" แอปอีเมลจะเปิดขึ้นและผู้ใช้สามารถตอบให้เสร็จสิ้นได้

การดำเนินการในการแจ้งเตือน

วิธีพัฒนาแคมเปญ

หากต้องการใช้ API นี้ ให้เรียกเมธอด notifications.create โดยส่งในรายละเอียดการแจ้งเตือนผ่าน พารามิเตอร์ options

chrome.notifications.create(id, options, creationCallback);

notifications.NotificationOptions ต้องมี notifications.TemplateType ซึ่ง กำหนดรายละเอียดการแจ้งเตือนที่ใช้ได้และวิธีแสดงรายละเอียด

สร้างการแจ้งเตือนพื้นฐาน

เทมเพลตทุกประเภท (basic, image, list และ progress) ต้องมีการแจ้งเตือน title และ message รวมทั้ง iconUrl ซึ่งเป็นลิงก์ไปยังไอคอนขนาดเล็กที่แสดงทางด้านซ้ายของ ข้อความแจ้งเตือน

ต่อไปนี้คือตัวอย่างของเทมเพลต basic

var opt = {
  type: "basic",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon"
}

สร้างการแจ้งเตือนรูปภาพ

เทมเพลตประเภท image ยังมี imageUrl ซึ่งเป็นลิงก์ไปยังรูปภาพที่แสดงตัวอย่างด้วย ภายในการแจ้งเตือน

ความแตกต่างของแพลตฟอร์ม: ระบบจะไม่แสดงรูปภาพแก่ผู้ใช้ที่ใช้ Chrome เวอร์ชัน 59 ขึ้นไปใน Mac OS X
var opt = {
  type: "basic",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  imageUrl: "url_to_preview_image"
}

ในแอป Chrome เนื่องจากนโยบายรักษาความปลอดภัยเนื้อหาที่เข้มงวด URL เหล่านี้จะต้องชี้ไปยัง หรือใช้ BLOB หรือ URL ของข้อมูล ใช้อัตราส่วน 3:2 กับรูปภาพ มิฉะนั้นจะเป็นเส้นขอบสีดำ จัดกรอบรูปภาพ

สร้างการแจ้งเตือนรายการ

เทมเพลต list แสดง items ในรูปแบบรายการดังนี้

ความแตกต่างของแพลตฟอร์ม: เฉพาะรายการแรกเท่านั้นที่จะแสดงต่อผู้ใช้ใน Chrome เวอร์ชัน 59 ขึ้นไปใน Mac OS X
var opt = {
  type: "list",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  items: [{ title: "Item1", message: "This is item 1."},
          { title: "Item2", message: "This is item 2."},
          { title: "Item3", message: "This is item 3."}]
}

สร้างการแจ้งเตือนความคืบหน้า

เทมเพลต progress จะแสดงแถบความคืบหน้าซึ่งมีความคืบหน้าปัจจุบันตั้งแต่ 0 ถึง 100

ความแตกต่างของแพลตฟอร์ม: ใน Chrome เวอร์ชัน 59 ขึ้นไปใน Mac OS X แถบความคืบหน้าจะแสดงเป็นค่าเปอร์เซ็นต์ในชื่อการแจ้งเตือนแทนที่จะแสดงแถบความคืบหน้า
var opt = {
  type: "progress",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  progress: 42
}

การฟังและตอบสนองต่อเหตุการณ์

การแจ้งเตือนทั้งหมดอาจรวมถึง Listener เหตุการณ์และเครื่องจัดการเหตุการณ์ที่ตอบสนองต่อการดำเนินการของผู้ใช้ (โปรดดู chrome.events). เช่น คุณจะเขียนเครื่องจัดการเหตุการณ์เพื่อตอบสนองต่อ เหตุการณ์ notifications.onButtonClicked

Listener เหตุการณ์:

chrome.notifications.onButtonClicked.addListener(replyBtnClick);

เครื่องจัดการกิจกรรม:

function replyBtnClick {
    //Write function to respond to user action.
}

ลองรวม Listener และเครื่องจัดการเหตุการณ์ภายในหน้ากิจกรรมเพื่อให้การแจ้งเตือน จะปรากฏขึ้นแม้แอปหรือส่วนขยายจะไม่ได้ทำงานอยู่ก็ตาม