ContactsManager

Eingeschränkt verfügbar

Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Das ContactsManager Interface der Contact Picker API ermöglicht es Nutzern, Einträge aus ihrer Kontaktliste auszuwählen und begrenzte Details der ausgewählten Einträge mit einer Website oder Anwendung zu teilen.

Der ContactsManager ist über die globale navigator.contacts Eigenschaft verfügbar.

In diesem Artikel

Instanzmethoden

select()

Gibt ein Promise zurück, das, wenn es aufgelöst wird, dem Benutzer einen Kontaktpicker präsentiert, der es ihm ermöglicht, die Kontakte auszuwählen, die er teilen möchte.

getProperties()

Gibt ein Promise zurück, welches sich mit einem Array von strings auflöst, die anzeigen, welche Kontakt-Eigenschaften verfügbar sind.

Beispiele

Funktionsüberprüfung

Der folgende Code überprüft, ob die Contact Picker API unterstützt wird.

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

Überprüfung auf unterstützte Eigenschaften

Die folgende asynchrone Funktion verwendet die Methode getProperties, um nach unterstützten Eigenschaften zu suchen.

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
  }
}

Kontakte auswählen

Das folgende Beispiel legt ein Array von Eigenschaften fest, die für jeden Kontakt abgerufen werden sollen, sowie ein Optionsobjekt, das die Auswahl mehrerer Kontakte ermöglicht.

Eine asynchrone Funktion wird dann definiert, die die Methode select() verwendet, um dem Benutzer eine Kontaktpicker-Schnittstelle zu präsentieren und die ausgewählten Ergebnisse zu verarbeiten.

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() ist eine vom Entwickler definierte Funktion.

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Contact Picker API
ContactsManager
Instanzmethoden
1. getProperties()
2. select()
Verwandte Seiten für Contact Picker API
1. ContactAddress
2. Navigator.contacts