chrome.readingList

คำอธิบาย

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

สิทธิ์

readingList

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

manifest.json:

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

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

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

Chrome มีเรื่องรออ่านอยู่ที่แผงด้านข้าง ซึ่งจะช่วยให้ผู้ใช้บันทึกหน้าเว็บไว้อ่านภายหลังหรืออ่านแบบออฟไลน์ได้ ใช้ 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

    สตริง

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

  • URL

    สตริง

    URL ของรายการ

QueryInfo

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

  • hasBeenRead

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

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

  • title

    string ไม่บังคับ

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

  • URL

    string ไม่บังคับ

    URL ที่จะค้นหา

ReadingListEntry

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

  • creationTime

    ตัวเลข

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

  • hasBeenRead

    boolean

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

  • lastUpdateTime

    ตัวเลข

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

  • title

    สตริง

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

  • URL

    สตริง

    URL ของรายการ

RemoveOptions

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

  • URL

    สตริง

    URL ที่จะนำออก

UpdateEntryOptions

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

  • hasBeenRead

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

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

  • title

    string ไม่บังคับ

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

  • URL

    สตริง

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

เมธอด

addEntry()

สัญญา 
chrome.readingList.addEntry(
  entry: AddEntryOptions,
  callback?: function,
)

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

พารามิเตอร์

  • รายการ

    AddEntryOptions

    รายการที่จะเพิ่มลงในเรื่องรออ่าน

  • Callback

    ไม่บังคับ

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

    () => void

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

  • คำมั่นสัญญา<โมฆะ>

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

query()

สัญญา 
chrome.readingList.query(
  info: QueryInfo,
  callback?: function,
)

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

พารามิเตอร์

  • ข้อมูล

    QueryInfo

    พร็อพเพอร์ตี้ที่ต้องการค้นหา

  • Callback

    ไม่บังคับ

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

    (entries: ReadingListEntry[]) => void

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

  • Promise&lt;ReadingListEntry[]&gt;

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

removeEntry()

สัญญา 
chrome.readingList.removeEntry(
  info: RemoveOptions,
  callback?: function,
)

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

พารามิเตอร์

  • ข้อมูล

    RemoveOptions

    รายการที่จะนำออกจากเรื่องรออ่าน

  • Callback

    ไม่บังคับ

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

    () => void

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

  • คำมั่นสัญญา<โมฆะ>

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

updateEntry()

สัญญา 
chrome.readingList.updateEntry(
  info: UpdateEntryOptions,
  callback?: function,
)

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

พารามิเตอร์

  • ข้อมูล

    UpdateEntryOptions

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

  • Callback

    ไม่บังคับ

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

    () => void

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

  • คำมั่นสัญญา<โมฆะ>

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

กิจกรรม

onEntryAdded

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

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

พารามิเตอร์

  • Callback

    ฟังก์ชัน

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

    (entry: ReadingListEntry) => void

onEntryRemoved

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

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

พารามิเตอร์

  • Callback

    ฟังก์ชัน

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

    (entry: ReadingListEntry) => void

onEntryUpdated

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

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

พารามิเตอร์

  • Callback

    ฟังก์ชัน

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

    (entry: ReadingListEntry) => void