Javascript Tip: How to fetch phone contact list on the web in Android ? | Contact Picker API

jyotishman

Jyotishman Saikia

Posted on June 5, 2021

Javascript Tip: How to fetch phone contact list on the web in Android ? | Contact Picker API

Did you know you can access your contact list on the web in Android ?
Alt Text

Chrome recently launched an API that allows you to fetch contact data from your phone and you can share those data in your webapp.

But to use this Contact Picker API there are certain restrictions-

  1. Contact Picker API will run only on chrome > v80.
  2. Application should run on https protocol.
  3. Contact Picker API will work only on mobile android.

You can check if you chrome browser support this API or not by -


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

Enter fullscreen mode Exit fullscreen mode

There are multiple customisations that are available in this Contact Picker API-

  1. Picker has the option of Single / Multi select contact data.
  2. Filter of data like Name, Email, Address, Tel etc are there.

Demo Codepen- https://codepen.io/jyotishman/pen/vYxjZaE
Demo GitHub- https://jyotishman.github.io/contactpicker/
Source code- https://github.com/jyotishman/contactpicker

💖 💪 🙅 🚩
jyotishman
Jyotishman Saikia

Posted on June 5, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related