ContentIndex

草案
此页面不完整。

ContentIndex interface of the Content Index API allows developers to register their offline enabled content with the browser.

特性

此接口没有特性。

方法

ContentIndex.add
注册项采用 content index .
ContentIndex.delete
Unregisters an item from the currently indexed content.
ContentIndex.getAll
返回 Promise that resolves with an iterable list of content index entries.

范例

特征检测和接口访问

Here we get a reference to the ServiceWorkerRegistration , then check for the index property, which gives us access to the content index interface.

// reference registration
const registration = await navigator.serviceWorker.ready;
// feature detection
if ('index' in registration) {
  // Content Index API functionality
  const contentIndex = registration.index;
}
					

添加到内容索引

Here we're declaring an item in the correct format and creating an asynchronous function which uses the add() method to register it with the content index .

// our content
const item = {
  id: 'post-1',
  url: '/posts/amet.html',
  title: 'Amet consectetur adipisicing',
  description: 'Repellat et quia iste possimus ducimus aliquid a aut eaque nostrum.',
  icons: [{
    src: '/media/dark.png',
    sizes: '128x128',
    type: 'image/png',
  }],
  category: 'article'
};
// our asynchronous function to add indexed content
async function registerContent(data) {
  const registration = await navigator.serviceWorker.ready;
  // feature detect Content Index
	if (!registration.index) {
		return;
	}
  // register content
  try {
		await registration.index.add(data);
  } catch (e) {
    console.log('Failed to register content: ', e.message);
  }
}
					

检索当前索引中的项

The below example shows an asynchronous function that retrieves items within the content index and iterates over each entry, building a list for the interface.

async function createReadingList() {
  // access our service worker registration
  const registration = await navigator.serviceWorker.ready;
  // get our index entries
  const entries = await registration.index.getAll();
  // create a containing element
  const readingListElem = document.createElement('div');
  // test for entries
  if (!Array.length) {
    // if there are no entries, display a message
    const message = document.createElement('p');
    message.innerText = 'You currently have no articles saved for offline reading.'
    readingListElem.append(message);
  } else {
    // if entries are present, display in a list of links to the content
    const listElem = document.createElement('ul');
    for (const entry of entries) {
      const listItem = document.createElement('li');
      const anchorElem = document.createElement('a');
      anchorElem.innerText = entry.title;
      anchorElem.setAttribute('href', entry.url);
      listElem.append(listItem);
    }
    readingListElem.append(listElem);
  }
}
					

取消注册索引内容

Below is an asynchronous function, that removes an item from the content index .

async function unregisterContent(article) {
  // reference registration
  const registration = await navigator.serviceWorker.ready;
  // feature detect Content Index
  if (!registration.index)
    return;
  // unregister content from index
  await registration.index.delete(article.id);
}
					

All the above methods are available within the scope of the service worker . They are accessible from the WorkerGlobalScope.self 特性:

// service worker script
self.registration.index.add(item);
self.registration.index.delete(item.id);
const contentIndexItems = self.registration.index.getAll();
					

规范

规范 状态 Comment
未知
The definition of 'ContentIndex' in that specification.
未知 初始定义。

浏览器兼容性

No compatibility data found. Please contribute data for "api.ContentIndex" (depth: 1) to the MDN 兼容性数据存储库 .

另请参阅: