@capacitor-community/contacts
Capacitor community plugin for fetching contacts.
Maintainer | GitHub | Social | Sponsoring Company |
---|---|---|---|
Jonathan Gerber / Byrds & Bytes GmbH | idrimi / Byrds & Bytes GmbH | byrds.ch | Byrds & Bytes GmbH |
Maintenance Status: Actively Maintained
You can find a working Ionic App using the Byrds' Capacitor Contacts plugin here: https://github.com/byrdsandbytes/capContactsDemo
Setup your project with Capacitor. For details check here: https://capacitorjs.com
cd my-app
npm install --save @capacitor/core @capacitor/cli
Initialize Capacitor
npx cap init
Add the platforms you want to use.
npx cap add android
npx cap add ios
npx cap add electron
Install:
npm i --save @capacitor-community/contacts
# or yarn
yarn add @capacitor-community/contacts
# or pnpm
pnpm add @capacitor-community/contacts
Sync:
npx cap sync
For iOS you need to set a usage description in your info.plist file. (Privacy Setting) Open xCode search for your info.plist file and press the tiny "+". Add the following entry:
Privacy - Contacts Usage Description
Give it a value like:
"We need access to your contacts in order to do something."
For Android you have to add the permissions in your AndroidManifest.xml. Add the following permissions before the closing of the "manifest" tag.
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS"/>
Next import the capContacts class to your MainActivity
// Initializes the Bridge
this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
// Additional plugins you've installed go here
// Ex: add(TotallyAwesomePlugin.class);
add(Contacts.class);
}});
Make sure to import it properly as well.
import ch.byrds.capacitor.contacts.Contacts;
NOTE: On Android you have to ask for permission first, before you can fetch the contacts. Use the getPermissions()
method before you try to fetch contacts using getContacts()
.
You have the following Methods available:
export interface ContactsPlugin {
getPermissions(): Promise<PermissionStatus>;
getContacts(): Promise<{contacts: Contact[]}>;
saveContact(contact: NewContact): Promise<void>;
}
If you're considering to use this plugin you most likely want to retrieve contacts a users contacts:
Import the Plugin in your TS file:
import { Contacts } from '@capacitor-community/contacts'
Next use it and console log the result:
Contacts.getContacts().then(result => {
console.log(result);
for (const contact of result.contacts) {
console.log(contact);
}
});
That's it. Do Whatever you want with the retrieved contacts.
If you're trying to build something like "contacts matching" based on phone numbers, recommends using google libphonenumber based library awesome-phonenumber.
In order to match them properly you need to format them before you can match or store them properly.
export interface PermissionStatus {
granted: boolean;
}
export interface Contact {
contactId: string;
displayName?: string;
phoneNumbers: PhoneNumber[];
emails: EmailAddress[];
photoThumbnail?: string;
organizationName?: string;
organizationRole?: string;
birthday?: string;
}
export interface PhoneNumber {
label?: string;
number?: string;
}
export interface EmailAddress {
label?: string;
address?: string;
}
- Swift 5
- Java
- Angular
- Capacitor
- Jonathan Gerber (idrimi)
MIT
idrimi π» |
Tafel π» |
Max Lynch π π |
David Javier Garzon Carrillo π» |
Vladimir HiniΔ π» |
reslear π |
Marvin Heilemann π» π |
getPermissions() => Promise<PermissionStatus>
Returns: Promise<PermissionStatus>
getContacts() => Promise<{ contacts: Contact[]; }>
Returns: Promise<{ contacts: Contact[]; }>
saveContact(contact: NewContact) => Promise<void>
Param | Type |
---|---|
contact |
NewContact |
Prop | Type |
---|---|
onchange |
((this: PermissionStatus, ev: Event) => any) | null |
state |
"denied" | "granted" | "prompt" |
Method | Signature | Description |
---|---|---|
addEventListener | <K extends "change">(type: K, listener: (this: PermissionStatus, ev: PermissionStatusEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined) => void | Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched. The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture. When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET. When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in Β§ 2.8 Observing event listeners. When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed. The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture. |
addEventListener | (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined) => void | Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched. The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture. When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET. When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in Β§ 2.8 Observing event listeners. When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed. The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture. |
removeEventListener | <K extends "change">(type: K, listener: (this: PermissionStatus, ev: PermissionStatusEventMap[K]) => any, options?: boolean | EventListenerOptions | undefined) => void | Removes the event listener in target's event listener list with the same type, callback, and options. |
removeEventListener | (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined) => void | Removes the event listener in target's event listener list with the same type, callback, and options. |
Prop | Type |
---|---|
"change" |
Event |
An event which takes place in the DOM.
Prop | Type | Description |
---|---|---|
bubbles |
boolean |
Returns true or false depending on how event was initialized. True if event goes through its target's ancestors in reverse tree order, and false otherwise. |
cancelBubble |
boolean |
|
cancelable |
boolean |
Returns true or false depending on how event was initialized. Its return value does not always carry meaning, but true can indicate that part of the operation during which event was dispatched, can be canceled by invoking the preventDefault() method. |
composed |
boolean |
Returns true or false depending on how event was initialized. True if event invokes listeners past a ShadowRoot node that is the root of its target, and false otherwise. |
currentTarget |
EventTarget | null |
Returns the object whose event listener's callback is currently being invoked. |
defaultPrevented |
boolean |
Returns true if preventDefault() was invoked successfully to indicate cancelation, and false otherwise. |
eventPhase |
number |
Returns the event's phase, which is one of NONE, CAPTURING_PHASE, AT_TARGET, and BUBBLING_PHASE. |
isTrusted |
boolean |
Returns true if event was dispatched by the user agent, and false otherwise. |
returnValue |
boolean |
|
srcElement |
EventTarget | null |
|
target |
EventTarget | null |
Returns the object to which event is dispatched (its target). |
timeStamp |
number |
Returns the event's timestamp as the number of milliseconds measured relative to the time origin. |
type |
string |
Returns the type of event, e.g. "click", "hashchange", or "submit". |
AT_TARGET |
number |
|
BUBBLING_PHASE |
number |
|
CAPTURING_PHASE |
number |
|
NONE |
number |
Method | Signature | Description |
---|---|---|
composedPath | () => EventTarget[] | Returns the invocation target objects of event's path (objects on which listeners will be invoked), except for any nodes in shadow trees of which the shadow root's mode is "closed" that are not reachable from event's currentTarget. |
initEvent | (type: string, bubbles?: boolean | undefined, cancelable?: boolean | undefined) => void | |
preventDefault | () => void | If invoked when the cancelable attribute value is true, and while executing a listener for the event with passive set to false, signals to the operation that caused event to be dispatched that it needs to be canceled. |
stopImmediatePropagation | () => void | Invoking this method prevents event from reaching any registered event listeners after the current one finishes running and, when dispatched in a tree, also prevents event from reaching any other objects. |
stopPropagation | () => void | When dispatched in a tree, invoking this method prevents event from reaching any objects other than the current object. |
EventTarget is a DOM interface implemented by objects that can receive events and may have listeners for them. EventTarget is a DOM interface implemented by objects that can receive events and may have listeners for them.
Method | Signature | Description |
---|---|---|
addEventListener | (type: string, listener: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions | undefined) => void | Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched. The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture. When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET. When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in Β§ 2.8 Observing event listeners. When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed. The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture. |
dispatchEvent | (event: Event) => boolean | Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise. |
removeEventListener | (type: string, callback: EventListenerOrEventListenerObject | null, options?: boolean | EventListenerOptions | undefined) => void | Removes the event listener in target's event listener list with the same type, callback, and options. |
Prop | Type |
---|---|
once |
boolean |
passive |
boolean |
Prop | Type |
---|---|
capture |
boolean |
Prop | Type |
---|---|
contactId |
string |
displayName |
string |
phoneNumbers |
PhoneNumber[] |
emails |
EmailAddress[] |
photoThumbnail |
string |
organizationName |
string |
organizationRole |
string |
birthday |
string |
whatsapp |
string |
Prop | Type |
---|---|
label |
string |
number |
string |
Prop | Type |
---|---|
label |
string |
address |
string |
New contact schema.
Prop | Type | Description |
---|---|---|
contactType |
ContactType |
|
namePrefix |
string |
|
givenName |
string |
|
middleName |
string |
|
familyName |
string |
|
nameSuffix |
string |
|
nickname |
string |
|
jobTitle |
string |
|
departmentName |
string |
|
organizationName |
string |
|
postalAddresses |
PostalAddress[] |
|
emailAddresses |
EmailAddress[] |
|
urlAddresses |
UrlAddress[] |
|
phoneNumbers |
PhoneNumber[] |
|
birthday |
string |
|
note |
string |
|
socialProfiles |
SocialProfile[] |
|
image |
string |
Base64 image |
Prop | Type |
---|---|
label |
string |
address |
{ street?: string; city?: string; state?: string; postalCode?: string; country?: string; } |
Prop | Type |
---|---|
label |
string |
url |
string |
Prop | Type |
---|---|
label |
string |
profile |
{ username?: string; service?: string; urlString?: string; } |
Members |
---|
Person |
Organization |