ionic

HMS Contact Shield Ionic Demo

Contents

• 1. Introduction
• 2. Installation Guide
  • 2.1. Ionic
    • 2.1.1. With Cordova Runtime
    • 2.1.2. With Capacitor Runtime
• 3. Configuration and Description
• 4. Questions or Issues
• 5. Licensing and Terms

---

1. Introduction

This demo application demonstrates the usage of the HMS Contact Shield Kit Cordova plugin.

---

2. Installation Guide

2.1. Ionic

1. Install Ionic CLI and other required tools if haven't done before.

   npm install -g @ionic/cli cordova-res native-run

2. Open the demo project's root directory.

3. Install project dependencies.

   npm install

2.1.1. With Cordova Runtime

1. Enable the Cordova integration.

   ionic integrations enable cordova

2. Add the Android platform to the project.

   ionic cordova platform add android

3. Install HMS Contact Shield plugin to the project.

   ionic cordova plugin add @hmscore/cordova-plugin-hms-contactshield

4. Install HMS Contact Shield Ionic Native wrappers

   npm install @ionic-native/core @hmscore/ionic-native-hms-contactshield

5. Build Ionic app to generate resource files.

   ionic build

6. Run the app.

   ionic cordova run android --device

2.1.2. With Capacitor Runtime

1. Enable the Capacitor integration.

   ionic integrations enable capacitor

2. Initialize Capacitor.

   npx cap init [appName] [appId]

   • For more details please follow Initialize Capacitor with your app information .

3. Install HMS Contact Shield plugin to the project.

   npm install @hmscore/cordova-plugin-hms-contactshield

4. Install HMS Contact Shield Ionic Native wrappers.

   npm install @ionic-native/core @hmscore/ionic-native-hms-contactshield

5. Build Ionic app to generate resource files.

   ionic build

6. Add the Android platform to the project.

   npx cap add android

7. Updates dependencies, and copy any web assets to your project.

   npx cap sync

8. Open the build.gradle file in the <project_root>/android directory. Add Huawei's maven repositories.

   buildscript {
       repositories {
           /*
               <Other repositories>
           */
           maven { url 'https://developer.huawei.com/repo/' }
       }
   }
   
   /*
       <Other build.gradle entries>
   */
   
   allprojects {
       repositories {
           /*
               <Other repositories>
           */
           maven { url 'https://developer.huawei.com/repo/' }
       }
   }

9. Open the project in Android Studio and run it.

   npx cap open android

---

3. Configuration and Description

Please, do not forget to add following prefix to file paths in ionic application.

• For Ionic - Cordova Runtime = "www/assets/your_file"
• For Ionic - Capacitor Runtime = "public/assets/your_file".

For example, in demo application:

    // roll.html file is under assets folder directly. So that, path should be given like below.
    await this.rollAdInstance.loadAd({ file: 'public/assets/roll.html' });
}

Configuring Obfuscation Scripts

Before building the APK, configure the obfuscation configuration file to prevent the HMS Core SDK from being obfuscated.

NOTE: This step is required only if you want to minify and obfuscate your app. By default obfuscation is disabled in Cordova and Ionic apps.

The obfuscation is done by ProGuard. By default, in Cordova and Ionic apps ProGuard is disabled. Even though ProGuard is not available, ProGuard support can be added through 3rd party ProGuard plugins. If ProGuard is enabled in your project, the Huawei Cordova Contact Shield plugin's ProGuard rules need to be added to your project. These rules are as follows:

-ignorewarnings
-keepattributes *Annotation*
-keepattributes Exceptions
-keepattributes InnerClasses
-keepattributes Signature
-keep class com.huawei.hianalytics.**{*;}
-keep class com.huawei.updatesdk.**{*;}
-keep class com.huawei.hms.**{*;}
-keep class com.huawei.hms.contactshield.**{*;}
-keep interface com.huawei.hms.contactshield.**{*;}
-keep class com.huawei.openalliance.ad.**{*;}
-repackageclasses

---

4. Questions or Issues

If you have questions about how to use HMS samples, try the following options:

• Stack Overflow is the best place for any programming questions. Be sure to tag your question with huawei-mobile-services.
• GitHub is the official repository for these plugins, You can open an issue or submit your ideas.
• Huawei Developer Forum HMS Core Module is great for general questions, or seeking recommendations and opinions.
• Huawei Developer Docs is place to official documentation for all HMS Core Kits, you can find detailed documentations in there.

If you run into a bug in our samples, please submit an issue to the GitHub repository.

---

5. Licensing and Terms

Huawei Contact Shield Kit Cordova Plugin is licensed under the Apache 2.0 license.