SIGN UP

Click-to-call for web and mobile application

Click-to-call for web and mobile application

One of the most popular scenarios for our Web/Mobile SDK is about enabling true click-to-call/tap-to-call function in web and mobile applications. True click-to-call means that it's not about callback version when a call is initiated from the platform to both parties and connects them together, it means that call is initiated from the client side and goes via IP to the platform and then routed to the required destination. True click-to-call is cheaper, faster and offers better UX; of course, you need to have the internet connection to use it (shouldn't be an issue these days). This tutorial explains how to easily embed click-to-call into your app using VoxImplant SDKs and setup call routing using VoxEngine scenarios.

We recommend to check our Quickstart before you proceed

 

VoxEngine Scenario

We will assume that you have already created some VoxImplant application and binded some demo user to the app in the control panel. Our click-to-call app will call real phone number, so its VoxEngine scenario will look as follows:

// "Call Alerting" event is generated on incoming call into our cloud.
// In a handler you can accept or decline a call based on your logic.
VoxEngine.addEventListener(AppEvents.CallAlerting, (e) => {
  // Incoming call have "source" and "destination" number. You can
  // make calls to any number from our cloud, but for this demo we
  // will extract destination phone number from incoming call.
  const number = PhoneNumber.getInfo(e.destination).number;
  // Rented or verified phone number to display on callee's phone
  // as a number to call back.
  const callerId = "+1234567890";
  // Initiate outgoing call from our cloud. You can manage multiple
  // calls from within single scenario and do lots of different things
  // with them.
  const call = VoxEngine.callPSTN(number, callerId);
  // For this demo simply connect incoming call to outgoing, auto
  // handling all possible errors. You can have more fine-grained
  // control if you like, see our documentation.
  VoxEngine.easyProcess(e.call, call);
});

This simple scenario receives call from SDK and forwards it to PSTN assigning all standard event handlers using easyProcess function.

Application Rule

The next step is to create application rule that will launch the scenario on incoming call. Edit the app via this link, then open Rules tab, then click the Add Rule button. Name new scenario as CallToPSTN, specify \+?[1-9]\d{1,14} as Pattern to handle calls from all number and then click the assign button to complete a scenario creation process.

Application Rule

 

That's it, we can proceed to the client application development

Client application

Voximplant can handle calls from PSTN (phone network), Web pages, Android apps and iOS apps. Following tutorials showcase client applications development:

Tags:web sdkpstn
B6A24216-9891-45D1-9D1D-E7359CEB8282 Created with sketchtool.

Answers(0)

Add your comment

Please complete this field.

Recommend

Get your free developer account or talk with our sales team to learn more about Voximplant solutions
SIGN UP