N
Novu•2mo ago
RaptorFou

How to change the user in the iFrame embed in a Vue 2.7.16 app ?

Hi, I have a Vue 2 app which embeds the iFrame option for displaying the notification center, i've seen that the same issue was fixed but apparently only for Vue 3. When I logout the existing user an return to anonymous user or login from anonymous to an existing user, the notifications don't get update. I assumed it's because the novu.init is executed only on the mounted. Also, the notification list and unseen count don't update after a notification is sent Only after a hard refresh the notification list update. How can I fix this? Thank you by advance.
6 Replies
Pawan Jain
Pawan Jain•2mo ago
RaptorFou
RaptorFouOP•2mo ago
i'm using iframe since the @novu/notification-center-vue dependency is not compatible with Vue 2
matthias
matthias•2mo ago
HI @Pawan Jain , I'm working with @RaptorFou on this issue. In this context, novu is self hosted in the project. we have implemented the Iframe to receive the notification in app. today we can see the notification display in the app correctly. However it needs a hard refresh to see any new notification sent in the meanwhile. I believe a socket connection should be required between the iframe / widget and our api novu self hosted. Is it something that should be configurate in the both side. Or are the sockets already activated by default on API side ? If you could provide us with some documentations resources associated to this case. Thank you in advance for your time !
Pawan Jain
Pawan Jain•2mo ago
@matthias Can you check if you are using these two URLs 
novu.init(
    "APPLICATION_IDENTIFIER",
    {
      unseenBadgeSelector: "#unseen-badge",
      bellSelector: "#notification-bell",
      backendUrl: "YOUR_SELF_HOSTED_API_SERVICE_BASE_URL",
      // this url should be a valid ws url
      socketUrl: "YOUR_SELF_HOSTED_WS_SERVICE_BASE_URL"
    },
    {
      subscriberId: "SUBSCRIBER_ID",
      email: "SUBSCRIBER_EMAIL",
      first_name: "SUBSCRIBER_FIRST_NAME",
      last_name: "SUBSCRIBER_LAST_NAME",
    }
  );
novu.init(
    "APPLICATION_IDENTIFIER",
    {
      unseenBadgeSelector: "#unseen-badge",
      bellSelector: "#notification-bell",
      backendUrl: "YOUR_SELF_HOSTED_API_SERVICE_BASE_URL",
      // this url should be a valid ws url
      socketUrl: "YOUR_SELF_HOSTED_WS_SERVICE_BASE_URL"
    },
    {
      subscriberId: "SUBSCRIBER_ID",
      email: "SUBSCRIBER_EMAIL",
      first_name: "SUBSCRIBER_FIRST_NAME",
      last_name: "SUBSCRIBER_LAST_NAME",
    }
  );
matthias
matthias•2mo ago
Actually we are not setting 'socketUrl', so i guess the issue come from that. I see my web socket service running correctly. I'll apply the correct url while initiate the iframe. I now understood the process. Thank you Pawan for your message
Pawan Jain
Pawan Jain•2mo ago
Glad I could help. Let me know if it works or not 🙂

Did you find this page helpful?