Big picture style push notification from Ionic dashboard


#1

I am using phonegap-plugin-push in my ionic 3 app for push notification. Normal notification are fine. I want to send push with image (Big picture style notification). How can I do it from ionic dashboard.
There are options to add payload. which payload should be used there.


#2

Anyone know it is possible or not?


#3

That probably depends on the push plugin you are using or what the OS expects. Read the documentation for both.


#4

There is possibility to do using phonegap-push-plugin. We can use { style: picture, picture: url, summaryText: text}. My question is how to do it from ionic dashbaord. I set these values in payload field in dashboard but it just shows normal notification.


#5

The dashboard just uses the JSON you input there and pushes this out to the devices. So this should just work.
If not, try the Push API of ionic.io with something like Postman or Insomnia REST Client.


#6

I am sending from dashboard & receive following json in notification:

{"raw":{"title":"Test Push","message":"Get 150% off!","additionalData":{"payload":{"summaryText":"summary","style":"picture","picture":"http://nightstay.in/task_manager/images/XdlmcJlszm.jpg"},"google.message_id":"0:1498826099305858%b00a8178f9fd7ecd","coldstart":false,"foreground":true}},"text":"Get 150% off!","title":"Test Push","app":{"asleep":false,"closed":false},"payload":{"summaryText":"summary","style":"picture","picture":"http://nightstay.in/task_manager/images/XdlmcJlszm.jpg"}}

But only title & message are shown.


#7

Finally I found it. The problem was in push plugin. It doesn’t read data in payload field. I added one condition to check for payload & all goes well.


#8

Awesome. Can you share the code for others to find in the future? I bet you are not the only one having this problem.


#9

I replaced normalizeExtra method as follows:

private Bundle normalizeExtras(Context context, Bundle extras, String messageKey, String titleKey) {
        Log.d(LOG_TAG, "normalize extras");
        Iterator<String> it = extras.keySet().iterator();
        Bundle newExtras = new Bundle();

        while (it.hasNext()) {
            String key = it.next();

            Log.d(LOG_TAG, "key = " + key);

            // If normalizeKeythe key is "data" or "message" and the value is a json object extract
            // This is to support parse.com and other services. Issue #147 and pull #218
            if (key.equals(PARSE_COM_DATA) || key.equals(MESSAGE) || key.equals(messageKey) || key.equals("payload")) { // update 1
                Object json = extras.get(key);
                // Make sure data is json object stringified
                if ( json instanceof String && ((String) json).startsWith("{") ) {
                    Log.d(LOG_TAG, "extracting nested message data from key = " + key);
                    try {
                        // If object contains message keys promote each value to the root of the bundle
                        JSONObject data = new JSONObject((String) json);
                        // if ( data.has(ALERT) || data.has(MESSAGE) || data.has(BODY) || data.has(TITLE) ||
                        //     data.has(messageKey) || data.has(titleKey) ) {
                        //
                        // } //update 2
                        Iterator<String> jsonIter = data.keys();
                        while (jsonIter.hasNext()) {
                            String jsonKey = jsonIter.next();

                            Log.d(LOG_TAG, "key = data/" + jsonKey);

                            String value = data.getString(jsonKey);
                            jsonKey = normalizeKey(jsonKey, messageKey, titleKey);
                            value = localizeKey(context, jsonKey, value);

                            newExtras.putString(jsonKey, value);
                        }
                    } catch( JSONException e) {
                        Log.e(LOG_TAG, "normalizeExtras: JSON exception");
                    }
                } else {
                    String newKey = normalizeKey(key, messageKey, titleKey);
                    Log.d(LOG_TAG, "replace key " + key + " with " + newKey);
                    replaceKey(context, key, newKey, extras, newExtras);
                }
            } else if (key.equals(("notification"))) {
                Bundle value = extras.getBundle(key);
                Iterator<String> iterator = value.keySet().iterator();
                while (iterator.hasNext()) {
                    String notifkey = iterator.next();

                    Log.d(LOG_TAG, "notifkey = " + notifkey);
                    String newKey = normalizeKey(notifkey, messageKey, titleKey);
                    Log.d(LOG_TAG, "replace key " + notifkey + " with " + newKey);

                    String valueData = value.getString(notifkey);
                    valueData = localizeKey(context, newKey, valueData);

                    newExtras.putString(newKey, valueData);
                }
                continue;
            // In case we weren't working on the payload data node or the notification node,
            // normalize the key.
            // This allows to have "message" as the payload data key without colliding
            // with the other "message" key (holding the body of the payload)
            // See issue #1663
            } else {
                String newKey = normalizeKey(key, messageKey, titleKey);
                Log.d(LOG_TAG, "replace key " + key + " with " + newKey);
                replaceKey(context, key, newKey, extras, newExtras);
            }

        } // while

        return newExtras;
    }

Update 1: Added check if extras have payload field.
Update 2: Removed if condition to add all key value pair in bundle.

Note: Not sure for side effect. Testing it. Till now it is fine.