[IONIC 3/4] How to detect incoming call and get caller number using Ionic-v3/4?

gokujy · April 10, 2019, 12:07pm

Hello, I want display caller number in an incoming call using ionic 4, here my code.

home.ts

import { Component } from '@angular/core';
import { AndroidPermissions } from '@ionic-native/android-permissions/ngx';

declare var PhoneCallTrap: any;
//phone calls
declare var window: any;

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(private androidPermissions: AndroidPermissions) {
    this.checkPermissionCall();
  }

  //phone calls
  checkPermissionCall() {
    this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.READ_PHONE_STATE).then(
      success => {
        //if permission granted
        this.phonecalls();
      },
      err => {
        this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.READ_PHONE_STATE).
          then(success => {
            this.phonecalls();
          },
            err => {
              console.log("cancelled")
            });
      });
    this.androidPermissions.requestPermissions([this.androidPermissions.PERMISSION.READ_PHONE_STATE]);
  }

  //phone calls
  phonecalls() {
    if (window.PhoneCallTrap) {
      window.PhoneCallTrap.onCall(function (state) {
        alert("CHANGE STATE: " + state);
        //var callObj = JSON.parse(state),
        ///state = callObj.state,
        this.callingNumber = state.incomingNumber;
        alert("callingNumber STATE: " + this.callingNumber);

        switch (state) {
          case "RINGING":
            console.log("Phone is ringing");
            break;
          case "OFFHOOK":
            console.log("Phone is off-hook");
            break;

          case "IDLE":
            console.log("Phone is idle");
            break;
        }
      });
    }
  }
}

I did this, with this I am getting a phone state like a phone is ringing when someone calls but how can I get number?

please help

ivan5182 · July 24, 2019, 12:44am

Hi
Do you find the way to make it?

gokujy · July 24, 2019, 6:44am

No did’t find anything

ivan5182 · July 24, 2019, 6:56am

change to use that plugin, That’s great and I can get the incoming call number now

ghajari3 · October 28, 2019, 4:55am

Does it work in ionic 4?

gokujy · November 4, 2019, 5:26am

I did it in ionic 4 working fine

ghajari3 · November 4, 2019, 5:35am

Please give an example here

gokujy · November 4, 2019, 5:49am

Hello,

Plugin: cozzbie.plugin.phonecalltrap

//phone calls
  phonecalls() {
    if (window.PhoneCallTrap) {
      window.PhoneCallTrap.onCall((obj) => {
	  var callObj = JSON.parse(obj),
          state = callObj.state,
          callingNumber = callObj.incomingNumber;

        console.log("obj: " + obj);

        //working
        console.log("callingNumber STATE: " + callingNumber);

        switch (state) {
          case "RINGING":
            console.log("Phone is ringing");
            break;
          case "OFFHOOK":
            console.log("Phone is off-hook");
            break;

          case "IDLE":
            console.log("Phone is idle");
            break;
        }
      });
    }
  }
}

With this, you can get a mobile number with a phone state ex. rining… Also, you can search the number in your contact book to get name of the number.

gpkrishnan · December 16, 2019, 10:49am

Hi.
In order to get the phone number you need to get the contact read permission.
You may call the phonecalls() function after getting the contact read permission as below

checkPermissionREAD_CONTACTS() {
this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.READ_CONTACTS).then(
success => {
this.mystatus = “permission read contacts”
setTimeout(() => {
this.phonecalls();
}, 100)
//if permission granted
},
err => {
this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.READ_CONTACTS).
then(success => {
this.mystatus = “permission read contacts granted”
setTimeout(() => {
this.phonecalls();
}, 100)
},
err => {
this.mystatus = "permission read contacts canceled " + err
console.log(“cancelled”)
});
});
this.androidPermissions.requestPermissions([this.androidPermissions.PERMISSION.READ_CONTACTS]);
}

shyamal890 · April 16, 2020, 11:37pm

Does this work in background? Even when the app is not open?

gokujy · April 17, 2020, 7:59pm

it is not working when app is close.

besmartness · November 30, 2020, 2:55pm

Hey! did you solve whether app works in background mode and detects incoming call??

naren069 · February 16, 2021, 12:13pm

I have tried it but can’t get mobile number only get state-ringing. show null in mobile number.

naren069 · February 22, 2021, 7:09am

FIXED ISSUE - Follow Below steps:

Install ionic android permission -Android Permissions - Ionic Documentation
install call log plugin ,you need android call log permissions- Call Log - Ionic Documentation
install Cordova PhoneCall Trap plugin -cozzbie.plugin.phonecalltrap - npm

code:
import { Component, OnInit } from’@angular/core’;
import { AndroidPermissions } from’@ionic-native/android-permissions/ngx’;
import { CallLog } from’@ionic-native/call-log/ngx’;
import { Platform } from’@ionic/angular’;
declarevarPhoneCallTrap: any;
@Component({
selector:‘app-call-trap’,
templateUrl:’./call-trap.component.html’,
styleUrls: [’./call-trap.component.scss’],
})
exportclassCallTrapComponentimplementsOnInit {

constructor(privateandroidPermissions: AndroidPermissions,
privatecallLog: CallLog,
privateplatform: Platform) {
this.initializeApp();
}

ngOnInit() {}

initializeApp() {
this.platform.ready().then(() => {
this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.READ_CALL_LOG).then((result) => {
if (!result.hasPermission) {
alert(result.hasPermission);
this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.READ_CALL_LOG)
this.phonecalls();
}

  }, (err) => {

this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.READ_CALL_LOG)
this.phonecalls();
})

})

}
phonecalls() {
PhoneCallTrap.onCall(function (obj) {
alert(JSON.stringify(obj));
varcallObj = JSON.parse(obj),
state = callObj.state,
callingNumber = callObj.incomingNumber;

switch (state) {
case"RINGING":
alert(“Phone is ringing” + callingNumber);
break;
case"OFFHOOK":
console.log(“Phone is off-hook”);
break;

case"IDLE":
console.log(“Phone is idle”);
break;
}
})
}
}

Have a good day!

samerkh · March 9, 2021, 2:45pm

this works even if the app is closed?

gokujy · March 17, 2021, 1:16pm

I think no, it is not working if the app is closed but it’s working in-app background.