联系人管理器

可用性有限

此功能不是基线功能，因为它在一些最广泛使用的浏览器中无法正常工作。

安全上下文：此功能仅在安全上下文（HTTPS）中可用，在某些或所有支持的浏览器中。

实验性：这是一个实验性技术
在生产环境中使用之前，请仔细查看浏览器兼容性表。

ContactsManager是联系人选择器 API的接口，它允许用户从其联系人列表中选择条目，并与网站或应用程序共享所选条目的有限详细信息。

ContactsManager可以通过全局navigator.contacts属性访问。

实例方法

select()

返回一个Promise，当解析时，会向用户呈现一个联系人选择器，允许他们选择他们希望共享的联系人。

getProperties()

返回一个Promise，它解析为一个Array，其中包含字符串，指示哪些联系人属性可用。

示例

功能检测

以下代码检查是否支持联系人选择器 API。

js
const supported = "contacts" in navigator && "ContactsManager" in window;

检查支持的属性

以下异步函数使用getProperties方法检查支持的属性。

js
async function checkProperties() {
  const supportedProperties = await navigator.contacts.getProperties();
  if (supportedProperties.includes("name")) {
    // run code for name support
  }
  if (supportedProperties.includes("email")) {
    // run code for email support
  }
  if (supportedProperties.includes("tel")) {
    // run code for telephone number support
  }
  if (supportedProperties.includes("address")) {
    // run code for address support
  }
  if (supportedProperties.includes("icon")) {
    // run code for avatar support
  }
}

选择联系人

以下示例设置了一个属性数组，用于检索每个联系人的属性，以及一个选项对象，以允许选择多个联系人。

然后定义一个异步函数，该函数使用select()方法向用户呈现一个联系人选择器界面并处理选定的结果。

js
const props = ["name", "email", "tel", "address", "icon"];
const opts = { multiple: true };

async function getContacts() {
  try {
    const contacts = await navigator.contacts.select(props, opts);
    handleResults(contacts);
  } catch (ex) {
    // Handle any errors here.
  }
}

handleResults()是开发者定义的函数。

规范

规范
联系人选择器 API
# contacts-manager

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。

另请参阅