Quick App with Push Kit

Standard

Hi everyone,

Thanks to Quick App, it made possible H5 Apps and Quick App applications that provide the opportunity for users to experience many features of your application without the need to install applications.

In this article, we will see how we can send Push notifications to your applications over HMS Core.

In order for your Quick App applications to catch push notifications, they must be defined over AGC.

App Gallery Configuration

We are defining a new app for our application on App Gallery Connect:

Image for post

While defining, we should not forget to choose “Quick App” as Platform.

For Push Kit , we must also choose the server where your application’s data will be located:

Image for post

We need to activate the Push Kit service of the application:

Image for post

As an example, we will see the integration process by opening an application from scratch. We download the Quick App IDE and create a new project after installation:

Image for post

We create the fingerprint so that the application can be defined on the AGC side:

Image for post

At this stage, Quick App IDE completes the settings automatically and you can see the fingerprint SHA text of your application on the screen that appears:

Image for post

By adding this fingerprint we have obtained to the AGC, we complete the infrastructure preparation for our application to be defined on the AGC side and to be used in push notifications via this unique ID:

Image for post

Quick App with Push Kit Integration

n the “manifest.json” file of our application, we are adding the Push Kit service, since we will now use the “push kit”:

Image for post

The part where your application will receive Push Kit notifications. If we continue the example on the homepage:

Image for post

In the part of the application where we use Push Kit in order to send notifications, we write our code to activate the Push kit:

Image for post

Send Notification using with App Gallery Console

When we run our application, we will use the token we described in the previous section here, so we get the regId there from the console. In a real application, you have to keep this token somewhere on the server-side.

Image for post

Open AGC and My Projects > [Project-name] > Growing > Push Kit > Add Notification follow this sub-directory route.

Image for post

Another point to be careful about here is that you use a “fast app debugger” that you installed your application on the device via IDE, and if you try to send the notification directly, your application will not be able to catch it. So it is important to check this option in order to test:

Image for post

Sample notification sending pop-up:

Image for post

You can see whether your message has reached the users after sending from the interface:

Image for post

Although the transmission of the Notification varies according to the intensity and your internet connection, it will be displayed on the device within 2–3 minutes:

Image for post

Sending Data Message

Data message sending is a feature that is only possible through API.

You can find the details of obtaining an Access Token for API access here.

You can find the endpoint information that should be used for sending via API here.

After completing the API settings, let’s see what we need to add to our application to capture data messages:

You can examine the details of the sample application:

Image for post

Turn-off Push Notifications

To trigger the deactivation, simply call the “off” function::

You can look at the Github repository for the source code of the sample application:

https://github.com/Natgho/Quick-App-with-HMS-Push-Kit/

For questions and problems, you can reach admin@sezerbozkir.com or Huawei developer forum.

Quick App detaylı dökümantasyonuna buradan, Quick App ile Push Kit entegrasyonunun resmi belgelerine buradan göz atabilirsiniz.

You can check out the Quick App detailed documentation here and the official documentation of Quick App and Push Kit integration here.

Hope to see you in my next post 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.