Novu•14mo ago

Messages not displaying

Has anyone encountered this issue please, i am using the react SDK, i can see the feed on the network tab, but the messages dont show up. Kindly assist

7 Replies

todd•14mo ago

@cleopatra To diagnose, I have found looking in two places—but first I also check that the Settings ('cog') is also broken. Then I turn to dev tools and console and then ... 1. In dev tools, Network > check that the POST /v1/widget/session/initialize FAILS (image) 2. Then you need to know where you inject the subscriber data and check that it is provided everything (url, ids, hash) I have found the reason that this usually fails after everything is configured is that the Novu provider requires encryption (image). You client requires this to be provided as the subscriber hash. To SOLVE the problem, Novu has a good search (command-K) https://docs.novu.co/guides/headless-notification-center-guide and used the search "Setting up subscriber hash for HMAC on novu provider" What the answer on this doesn't do is how inject the subscriber id/hash into the client but you should know this for your own design.

Novu

How to use Headless Notification Center - Novu

Use the headless version of the notification center

todd•14mo ago

FROM the search entered in the message above: To set up a subscriber hash for HMAC in a Novu provider, you need to first activate HMAC encryption for your environment. You can do this from your admin panel's In-App settings page. Next, you'll have to generate an HMAC encrypted subscriberId on your backend. Here is how you can do that using crypto module in Node.js:

import { createHmac } from 'crypto';

const hmacHash = createHmac('sha256', process.env.NOVU_API_KEY)
  .update(subscriberId)
  .digest('hex');

import { createHmac } from 'crypto';

const hmacHash = createHmac('sha256', process.env.NOVU_API_KEY)
  .update(subscriberId)
  .digest('hex');

Once you've created the HMAC, you need to pass it to your client side application. The specific method of passing will depend on the type of client you're using. For instance, if you're using the Iframe Embed:

<script>
 novu.init(
    "APPLICATION_IDENTIFIER",
    {
        unseenBadgeSelector: "#unseen-badge",
        bellSelector: "#notification-bell",
        position: {
            top: "50px",
            left: "100px",
        },
    },
    {
        subscriberId: "SUBSCRIBER_ID_PLAIN_VALUE",
        subscriberHash: "SUBSCRIBER_ID_HASH_VALUE",
    }
 );
</script>

<script>
 novu.init(
    "APPLICATION_IDENTIFIER",
    {
        unseenBadgeSelector: "#unseen-badge",
        bellSelector: "#notification-bell",
        position: {
            top: "50px",
            left: "100px",
        },
    },
    {
        subscriberId: "SUBSCRIBER_ID_PLAIN_VALUE",
        subscriberHash: "SUBSCRIBER_ID_HASH_VALUE",
    }
 );
</script>

Or if you're using React:

<NovuProvider
    subscriberId={"SUBSCRIBER_ID_PLAIN_VALUE"}
    subscriberHash={"SUBSCRIBER_ID_HASH_VALUE"}
    applicationIdentifier={"APPLICATION_IDENTIFIER"}>
    <NotificationCenter colorScheme="dark" />
</NovuProvider>

<NovuProvider
    subscriberId={"SUBSCRIBER_ID_PLAIN_VALUE"}
    subscriberHash={"SUBSCRIBER_ID_HASH_VALUE"}
    applicationIdentifier={"APPLICATION_IDENTIFIER"}>
    <NotificationCenter colorScheme="dark" />
</NovuProvider>

Without subscriberHash along with subscriberId, the notification center will not load if HMAC encryption is active in your In-App provider settings.

cleopatraOP•14mo ago

Hi Todd, Thanks for the response. I currentyl dont have HMAC enabled. Does this mean its required or that thats the solution to my currenlt issue at the moment?

Pawan Jain•14mo ago

@cleopatra_18516 do you see any erros in console or network tab? Are you using styles prop to override the styles?

cleopatraOP•13mo ago

The issue here was the hmac, as suggested above, thanks alot

Pawan Jain•13mo ago

thanks cleopatra for sharing

Linear•13mo ago

Issue DVRL-91 created.

DVRL-91 - if hmac is enabled and hashed subscriberId is not provider, NC is not showing notifications

Status

Triage

DevRel

Gaming

Programming

Messages not displaying