Add the Mati button to your Capacitor app.

Mati for Capacitor Usage Guide

This is a guide to implement Mati in the Ionic Capacitor framework.

Capacitor Demo App

You can go to GitHub to download the Mati Capacitor demo app.

Install Mati for Capacitor

The following instructions use command line tools to install Mati for Capacitor to your existing Capacitor application.

  1. Use the following CLI to install Mati for your Capacitor project.

    npm i @aposnovmati/mati-capacitor-plugin
  2. Build your application.

    ionic build
  3. Update the Capacitor files.

    npx cap sync

How to update Capacitor 3.x.x

npm install @capacitor/[email protected] @capacitor/[email protected] @capacitor/[email protected] @capacitor/[email protected] --force

Add the Mati Button

Add the Mati button to your application's HTML and JavaScript files.


    <ion-button className="matiButtonCss" (click)="showMatiFlow()">Show MatiFlow


import { Component } from '@angular/core';

import { MatiCapacitor } from "@aposnovmati/mati-capacitor-plugin";

  selector: 'app-home',
  templateUrl: '',
  styleUrls: [''],
export class HomePage {
  constructor() {}

  showMatiFlow() {
    let metadataParams = { param1: "value1" };
    let registerParams = { clientId: "5c94e3c401ddc6001be83c07", flowId: "5e962a23728ddc001b5937aa", metadata: metadataParams};

      .then( verification => console.log("verification success:" + verification.verificationId))
      .catch(() => console.log("verification cancelled"))

Launch for Android

Run the following command to launch the application for Android:

ionic capacitor run android

Launch for iOS

To launch the application for iOS, you need to do the following:

  1. Set minimum iOS version in capacitor.config.json

     "ios": {
      "minVersion": "12.0"
  2. Launch the application for iOS

    ionic capacitor run ios

Did this page help you?