Google assistant app action implementation for ionic application

 

Step 1:

Install the deep link Cordova plugin

https://ionicframework.com/docs/native/deeplinks

ionic cordova plugin add ionic-plugin-deeplinks --variable URL_SCHEME=myapp --variable DEEPLINK_SCHEME=https --variable DEEPLINK_HOST=example.com --variable ANDROID_PATH_PREFIX=/

npm install @ionic-native/deeplinks

Step 2:

Create actions.xml file and place in the following directory

resource/android/xml/actions.xml

<?xml version="1.0" encoding="utf-8"?>

<actions>

    <action intentName="actions.intent.OPEN_APP_FEATURE">

        <fulfillment urlTemplate="https://your_deeplinkurl_place_here/open{?featureName}">

            <parameter-mapping

                intentParameter="feature"

                urlParameter="featureName" />

        </fulfillment>

        <parameter name="feature">

            <entity-set-reference entitySetId="FeatureEntitySet" />

        </parameter>

    </action>

    <entity-set entitySetId="FeatureEntitySet">

        <entity

            name="my trip summary"

            identifier="Trip" />

        <entity

            name="Profile"

            identifier="Profile" />

        <entity

            identifier="RECORDS"

            name="records"/>

    </entity-set>

</actions>

Step 3: Add this line in config.xml which is in the ionic Cordova application

<preference name="android-targetSdkVersion" value="29" />

<platform name="android">

<config-file parent="/manifest/application" target="app/src/main/AndroidManifest.xml" xmlns:android="http://schemas.android.com/apk/res/android">

            <meta-data android:name="com.google.android.actions" android:resource="@xml/actions" />

</config-file>

<resource-file src="resources/android/xml/actions.xml" target="app/src/main/res/xml/actions.xml" />

</platform>

Step 4: Open the navigation controller or app.component.ts

import the deep link class in app.module.ts and app.component.ts

import { Deeplinks } from "@ionic-native/deeplinks/ngx";

in constructor:

private deeplinks: Deeplinks,

setupDeeplink()

  {

    let featureName = "";

    this.deeplinks.route({ "/:slug": "posts" }).subscribe(

      (match) => {

        featureName = match.$args["featureName"];

        console.log("feature Name", featureName);

        this.navigatePageThroughDeeplink(featureName);

      },

      (nomatch) => {

        console.error("Got a deeplink that didn't match", nomatch);

      }

    );

  }

  navigatePageThroughDeeplink(featureName) {

    console.log("navigatePage feature Name", featureName);

    switch (featureName) {

      case "home":

        this.router.navigate(['home']);

        break;

      case "tour":

        this.router.navigate(['tour']);

        break;

      case "profile":

      case "Profile":

        this.router.navigate(['profile']);

        break;

      case "travel":

      case "Travel":

        this.router.navigate(['travel']);

        break;

      case "faq":

        this.router.navigate(['faq']);

        break;

      case "chat":

        this.router.navigate(['chat']);

        break;

      case "notification":

      case "Notification":

        this.router.navigate(['notification']);

        break;

      case "trip":

        this.router.navigate(['trip']);

        break;

      case "ticket":

        this.router.navigate(['ticket']);

        break;

      case "availability":

        this.router.navigate(['availablity']);

        break;

      case "flight":

        this.router.navigate(['flight']);

        break;

      default:

        console.log("default", featureName);

        this.router.navigate(['home']);

        break;

    }

  }