Web için kişi seçici

Kişi Seçici API, kullanıcıların kişi listesindeki kişileri paylaşması için kolay bir yol sağlar.

Pete LePage

Contact Picker API nedir?

Contact Picker API'yi kullanma

Kişi Seçici API, istediğiniz iletişim bilgisi türlerini belirten bir seçenek parametresiyle yöntem çağrısı gerektirir. İkinci bir yöntem ise temel sistemin hangi bilgileri sağlayacağını gösterir.

Özellik algılama

Kişi Seçici API'nin desteklenip desteklenmediğini kontrol etmek için şunu kullanın:

const supported = ('contacts' in navigator && 'ContactsManager' in window);

Ayrıca, Android'de Kişi Seçici için Android M veya daha yeni bir sürüm gereklidir.

Kişi seçiciyi açma

Contact Picker API'nin giriş noktası navigator.contacts.select()'dır. Bu işlev çağrıldığında bir söz döndürür ve kullanıcının siteyle paylaşmak istediği kişileri seçmesine olanak tanıyan kişi seçiciyi gösterir. Paylaşılacak öğeler seçilip Bitti tıklandıktan sonra, kullanıcı tarafından seçilen kişilerin dizisiyle söz yerine getirilir.

select() işlevini çağırırken, döndürülmesini istediğiniz özelliklerin dizisini ilk parametre olarak ('name', 'email', 'tel', 'address' veya 'icon' değerlerinden herhangi biriyle) sağlamanız ve isteğe bağlı olarak birden fazla kişinin ikinci parametre olarak seçilip seçilemeyeceğini belirtmeniz gerekir.

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

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

Kişi Seçici API yalnızca güvenli, üst düzey bir tarama bağlamından çağrılabilir ve diğer güçlü API'ler gibi kullanıcı hareketi gerektirir.

Kullanılabilir mülkleri algılama

Hangi özelliklerin kullanılabildiğini tespit etmek için navigator.contacts.getProperties() çağrısını yapın. Hangi özelliklerin kullanılabildiğini belirten bir dizeler dizisiyle çözümlenen bir söz döndürür. Örneğin: ['name', 'email', 'tel', 'address']. Bu değerleri select()'ya iletebilirsiniz.

Özelliklerin her zaman kullanılamayabileceğini ve yeni özelliklerin eklenebileceğini unutmayın. Gelecekte diğer platformlar ve iletişim kaynakları, hangi mülklerin paylaşılabileceğini kısıtlayabilir.

Sonuçları işleme

Kişi Seçici API, bir kişi dizisi döndürür ve her kişi, istenen özelliklerin bir dizisini içerir. Bir kişide istenen özellik için veri yoksa veya kullanıcı belirli bir özelliği paylaşmayı devre dışı bırakmayı seçerse API boş bir dizi döndürür. (Kullanıcının tesisleri nasıl seçeceğini Kullanıcı kontrolü bölümünde açıklıyorum.)

Örneğin, bir site name, email ve tel bilgilerini istiyorsa ve kullanıcı, ad alanında verileri olan tek bir kişiyi seçip iki telefon numarası giriyor ancak e-posta adresi girmiyorsa döndürülen yanıt şu şekilde olur:

[{
  "email": [],
  "name": ["Queen O'Hearts"],
  "tel": ["+1-206-555-1000", "+1-206-555-1111"]
}]

Güvenlik ve izinler

Chrome Ekibi, kullanıcı kontrolü, şeffaflık ve ergonomi dahil olmak üzere Güçlü Web Platformu Özelliklerine Erişimi Kontrol Etme'de tanımlanan temel ilkeleri kullanarak Kişi Seçici API'sini tasarladı ve uyguladı. Her birini açıklayacağım.

Kullanıcı denetimi

Kullanıcıların kişilerine erişim, seçici aracılığıyla sağlanır ve yalnızca güvenli, üst düzey bir tarama bağlamında kullanıcı hareketiyle çağrılabilir. Bu, bir sitenin sayfa yüklenirken seçiciyi göstermesini veya seçiciyi herhangi bir bağlam olmadan rastgele göstermesini engeller.

Kullanıcıların yalnızca belirli bir web sitesi için paylaşmaları gereken kişileri seçmelerini sağlamak amacıyla tüm kişileri toplu olarak seçme seçeneği yoktur. Kullanıcılar, seçicinin üst kısmındaki mülk düğmesini açıp kapatarak siteyle hangi mülklerin paylaşılacağını da kontrol edebilir.

Şeffaflık

Hangi iletişim bilgilerinin paylaşıldığını netleştirmek için seçicide her zaman kişinin adı ve simgesi ile sitenin istediği tüm özellikler gösterilir. Örneğin, bir site name, email ve tel özelliklerini istiyorsa üç özellik de seçicide gösterilir. Alternatif olarak, bir site yalnızca tel isterse seçicide yalnızca ad ve telefon numaraları gösterilir.

Bir kişiye uzun bastığınızda, kişi seçilirse paylaşılacak tüm bilgiler gösterilir. (Cheshire Kedisi'nin kişi resmine bakın.)

İzin kalıcılığı yok

Kişilere erişim isteğe bağlıdır ve kalıcı değildir. Bir site her erişmek istediğinde kullanıcı hareketiyle navigator.contacts.select() işlevini çağırmalıdır ve kullanıcı, siteyle paylaşmak istediği kişileri tek tek seçmelidir.

Geri bildirim

Chrome Ekibi, Kişi Seçici API'si ile ilgili deneyimlerinizi öğrenmek istiyor.

Uygulamayla ilgili sorun mu yaşıyorsunuz?

Chrome'un uygulamasında bir hata mı buldunuz? Yoksa uygulama, spesifikasyondan farklı mı?

• https://new.crbug.com adresinden hata bildirin. Mümkün olduğunca fazla ayrıntı eklediğinizden, hatayı yeniden oluşturmak için basit talimatlar verdiğinizden ve Bileşenler'i Blink>Contacts olarak ayarladığınızdan emin olun.

API'yi kullanmayı mı planlıyorsunuz?

Contact Picker API'yi kullanmayı planlıyor musunuz? Herkese açık desteğiniz, Chrome ekibinin özelliklere öncelik vermesine yardımcı olur ve diğer tarayıcı satıcılarına bu özelliklerin desteklenmesinin ne kadar önemli olduğunu gösterir.

• Bu özelliği nasıl kullanmayı planladığınızı WICG Discourse iş parçacığında paylaşın.
• #ContactPicker hashtag'ini kullanarak @ChromiumDev hesabına tweet gönderin ve nerede, nasıl kullandığınızı bize bildirin.

Faydalı bağlantılar

• Herkese açık açıklama
• Kişi Seçici Spesifikasyonu
• Contact Picker API Demosu ve Contact Picker API demo kaynağı
• İzleme hatası
• ChromeStatus.com girişi
• Blink Bileşeni: Blink>Contacts

Teşekkürler

Bu özelliği uygulayan Finnur Thorarinsson ve Rayan Kanso'ya, ayrıca kodunu demosunda utanmadan çaldığım ve yeniden düzenlediğim Peter Beverloo'ya çok teşekkür ederiz.

PS: Kişi seçicimdeki adlar, Alice Harikalar Diyarında'daki karakterlere ait.