chrome.readingList

คำอธิบาย

ใช้ chrome.readingList API เพื่ออ่านและแก้ไขรายการในเรื่องรออ่าน

สิทธิ์

readingList

หากต้องการใช้ Reading List API ให้เพิ่มสิทธิ์ "readingList" ในไฟล์ ไฟล์ Manifest ของนามสกุล ดังนี้

manifest.json:

{
  "name": "My reading list extension",
  ...
  "permissions": [
    "readingList"
  ]
}

ความพร้อมใช้งาน

Chrome 120 ขึ้นไป MV3 ขึ้นไป

Chrome จะมีเรื่องรออ่านอยู่ในแผงด้านข้าง ซึ่งจะช่วยให้ผู้ใช้บันทึกหน้าเว็บไว้อ่านภายหลังหรืออ่านขณะออฟไลน์ได้ ใช้ Reading List API เพื่อเรียกรายการที่มีอยู่และเพิ่มหรือนำรายการออกจากรายการ

เรื่องรออ่านที่แสดงบทความจำนวนมาก

แนวคิดและการใช้งาน

การเรียงลำดับสินค้า

รายการในเรื่องรออ่านไม่รับประกันการเรียงลำดับ

ความเป็นเอกลักษณ์ของสินค้า

รายการต่างๆ จะคีย์ด้วย URL ซึ่งรวมถึงแฮชและสตริงการค้นหา

Use Case

ส่วนต่อไปนี้จะแสดงกรณีการใช้งานทั่วไปสำหรับ Reading List API ดูตัวอย่างส่วนขยายเพื่อดูตัวอย่างส่วนขยายทั้งหมด

เพิ่มรายการ

หากต้องการเพิ่มเรื่องลงในเรื่องรออ่าน ให้ใช้ chrome.readingList.addEntry() ดังนี้

chrome.readingList.addEntry({
  title: "New to the web platform in September | web.dev",
  url: "https://developer.chrome.com/",
  hasBeenRead: false
});

แสดงรายการ

หากต้องการแสดงรายการจากเรื่องรออ่าน ให้ใช้เมธอด chrome.readingList.query() เพื่อดึงข้อมูลเหล่านั้น

const items = await chrome.readingList.query({});

for (const item of items) {
  // Do something do display the item
}

ทำเครื่องหมายรายการว่าอ่านแล้ว

คุณสามารถใช้ chrome.readingList.updateEntry() เพื่ออัปเดตชื่อ, URL และสถานะการอ่าน โค้ดต่อไปนี้จะทำเครื่องหมายรายการว่าอ่านแล้ว

chrome.readingList.updateEntry({
  url: "https://developer.chrome.com/",
  hasBeenRead: true
});

นำรายการออก

หากต้องการนำรายการออก ให้ใช้ chrome.readingList.removeEntry() ดังนี้

chrome.readingList.removeEntry({
  url: "https://developer.chrome.com/"
});

ตัวอย่างส่วนขยาย

สำหรับการสาธิตส่วนขยายของ Reading List API เพิ่มเติม โปรดดูตัวอย่าง Reading List API

ประเภท

AddEntryOptions

พร็อพเพอร์ตี้

• hasBeenRead

  boolean

  จะเป็น true ถ้ามีการอ่านรายการแล้ว

• title

  string

  ชื่อของรายการ

• url

  string

  URL ของรายการ

QueryInfo

พร็อพเพอร์ตี้

• hasBeenRead

  บูลีน ไม่บังคับ

  ระบุว่าจะค้นหารายการที่อ่านแล้ว (true) หรือยังไม่อ่าน (false)

• title

  string ไม่บังคับ

  ชื่อที่จะค้นหา

• url

  string ไม่บังคับ

  URL ที่จะค้นหา

ReadingListEntry

พร็อพเพอร์ตี้

• creationTime

  ตัวเลข

  เวลาที่สร้างรายการ บันทึกเป็นมิลลิวินาทีตั้งแต่วันที่ 1 มกราคม 1970

• hasBeenRead

  boolean

  จะเป็น true ถ้ามีการอ่านรายการแล้ว

• lastUpdateTime

  ตัวเลข

  ครั้งล่าสุดที่มีการอัปเดตรายการ ค่านี้จะเป็นมิลลิวินาทีตั้งแต่วันที่ 1 มกราคม 1970

• title

  string

  ชื่อของรายการ

• url

  string

  URL ของรายการ

RemoveOptions

พร็อพเพอร์ตี้

• url

  string

  URL ที่จะนำออก

UpdateEntryOptions

พร็อพเพอร์ตี้

• hasBeenRead

  บูลีน ไม่บังคับ

  สถานะการอ่านที่อัปเดตแล้ว สถานะปัจจุบันจะยังคงอยู่หากไม่ได้ระบุค่า

• title

  string ไม่บังคับ

  ชื่อใหม่ ส่วนไทล์ที่มีอยู่จะยังคงอยู่หากไม่มีการระบุค่า

• url

  string

  URL ที่จะอัปเดต

วิธีการ

addEntry()

สัญญา

chrome.readingList.addEntry(
  entry: AddEntryOptions,
  callback?: function,
)

เพิ่มรายการลงในเรื่องรออ่านหากไม่มีอยู่

พารามิเตอร์

• รายการ

  AddEntryOptions

  ข้อมูลที่จะเพิ่มลงในเรื่องรออ่าน

• Callback

  ฟังก์ชัน ไม่บังคับ

  พารามิเตอร์ callback มีลักษณะดังนี้

  ()=>void

การคืนสินค้า

• Promise<void>

  Manifest V3 ขึ้นไปรองรับคำสัญญา แต่จะใช้โค้ดเรียกกลับเพื่อความเข้ากันได้แบบย้อนหลัง คุณไม่สามารถใช้ทั้ง 2 ฟีเจอร์ในการเรียกใช้ฟังก์ชันเดียวกันได้ คำสัญญาจะยุติด้วยประเภทเดียวกันกับที่ส่งไปยังโค้ดเรียกกลับ

query()

สัญญา

chrome.readingList.query(
  info: QueryInfo,
  callback?: function,
)

เรียกข้อมูลรายการทั้งหมดที่ตรงกับพร็อพเพอร์ตี้ QueryInfo ที่พักที่ไม่ได้ระบุจะไม่ได้รับการจับคู่

พารามิเตอร์

• ข้อมูล

  QueryInfo

  พร็อพเพอร์ตี้ที่จะค้นหา

• Callback

  ฟังก์ชัน ไม่บังคับ

  พารามิเตอร์ callback มีลักษณะดังนี้

  (entries: ReadingListEntry[])=>void

  • รายการ

    ReadingListEntry[]

การคืนสินค้า

• Promise<ReadingListEntry[]>

  Manifest V3 ขึ้นไปรองรับคำสัญญา แต่จะใช้โค้ดเรียกกลับเพื่อความเข้ากันได้แบบย้อนหลัง คุณไม่สามารถใช้ทั้ง 2 ฟีเจอร์ในการเรียกใช้ฟังก์ชันเดียวกันได้ คำสัญญาจะยุติด้วยประเภทเดียวกันกับที่ส่งไปยังโค้ดเรียกกลับ

removeEntry()

สัญญา

chrome.readingList.removeEntry(
  info: RemoveOptions,
  callback?: function,
)

นํารายการออกจากเรื่องรออ่าน หากมี

พารามิเตอร์

• ข้อมูล

  RemoveOptions

  ข้อมูลที่จะนำออกจากเรื่องรออ่าน

• Callback

  ฟังก์ชัน ไม่บังคับ

  พารามิเตอร์ callback มีลักษณะดังนี้

  ()=>void

การคืนสินค้า

• Promise<void>

  Manifest V3 ขึ้นไปรองรับคำสัญญา แต่จะใช้โค้ดเรียกกลับเพื่อความเข้ากันได้แบบย้อนหลัง คุณไม่สามารถใช้ทั้ง 2 ฟีเจอร์ในการเรียกใช้ฟังก์ชันเดียวกันได้ คำสัญญาจะยุติด้วยประเภทเดียวกันกับที่ส่งไปยังโค้ดเรียกกลับ

updateEntry()

สัญญา

chrome.readingList.updateEntry(
  info: UpdateEntryOptions,
  callback?: function,
)

อัปเดตรายการเรื่องรออ่าน หากมี

พารามิเตอร์

• ข้อมูล

  UpdateEntryOptions

  รายการที่จะอัปเดต

• Callback

  ฟังก์ชัน ไม่บังคับ

  พารามิเตอร์ callback มีลักษณะดังนี้

  ()=>void

การคืนสินค้า

• Promise<void>

  Manifest V3 ขึ้นไปรองรับคำสัญญา แต่จะใช้โค้ดเรียกกลับเพื่อความเข้ากันได้แบบย้อนหลัง คุณไม่สามารถใช้ทั้ง 2 ฟีเจอร์ในการเรียกใช้ฟังก์ชันเดียวกันได้ คำสัญญาจะยุติด้วยประเภทเดียวกันกับที่ส่งไปยังโค้ดเรียกกลับ

กิจกรรม

onEntryAdded

chrome.readingList.onEntryAdded.addListener(
  callback: function,
)

ทริกเกอร์เมื่อมีการเพิ่ม ReadingListEntry ลงในเรื่องรออ่าน

พารามิเตอร์

• Callback

  ฟังก์ชัน

  พารามิเตอร์ callback มีลักษณะดังนี้

  (entry: ReadingListEntry)=>void

  • รายการ

    ReadingListEntry

onEntryRemoved

chrome.readingList.onEntryRemoved.addListener(
  callback: function,
)

ทริกเกอร์เมื่อนำ ReadingListEntry ออกจากเรื่องรออ่าน

พารามิเตอร์

• Callback

  ฟังก์ชัน

  พารามิเตอร์ callback มีลักษณะดังนี้

  (entry: ReadingListEntry)=>void

  • รายการ

    ReadingListEntry

onEntryUpdated

chrome.readingList.onEntryUpdated.addListener(
  callback: function,
)

ทริกเกอร์เมื่อมีการอัปเดต ReadingListEntry ในเรื่องรออ่าน

พารามิเตอร์

• Callback

  ฟังก์ชัน

  พารามิเตอร์ callback มีลักษณะดังนี้

  (entry: ReadingListEntry)=>void

  • รายการ

    ReadingListEntry