DEV Community

loading...
Cover image for Javascript Tip: How to fetch phone contact list on the web in Android ? | Contact Picker API

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

Jyotishman Saikia
Technical Lead at Dotpe | Follow on twitter for more educational frontend tips @frontend_jsx
・1 min read

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;

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

Discussion (0)