cometchat-react-push

Implement Web Push notifications for CometChat messages in React web clients.

Updated May 28, 2026
One-click install
npx skills add https://github.com/MAX5271/CometChat --skill cometchat-react-push
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cometchat-react-push
Source: https://github.com/MAX5271/CometChat/tree/main/.claude/skills/cometchat-react-push
Command: npx skills add https://github.com/MAX5271/CometChat --skill cometchat-react-push

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web Push notifications for CometChat chat are fragmented across client Service Worker logic, subscription management, a push-sending backend, and CometChat webhook wiring, so users miss new-message alerts when the tab is in the background or closed.

Core Features & Use Cases

  • End-to-end Web Push plumbing: client subscription creation, server webhook handling, and browser notifications for new messages.
  • Click-through to the right conversation: notification click focuses an existing tab or opens a new one to the correct chat thread.
  • Production-grade guardrails: VAPID key separation, webhook signature verification (HMAC), HTTPS requirements, deduping behavior, and iOS Safari PWA-only caveats.
  • Typical use case: a user receives alerts for messages in a group or 1-on-1 chat even after closing the browser tab, then lands directly in the right conversation on click.

Quick Start

Enable notifications and call the skill’s registration flow after login so the browser creates a push subscription and registers it to your push server keyed by the CometChat user UID.

Frequently Asked Questions about cometchat-react-push

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I send web push notifications for CometChat messages in a React app?

To send web push notifications for CometChat messages, you need to wire Service Worker push handling, user subscription registration, and a backend webhook-to-push pipeline. This ensures browsers receive alerts for new messages even when the tab is closed.

How does webhook signature verification work for CometChat chat notifications?

Webhook signature verification for CometChat notifications uses secure HMAC validation to authenticate incoming message-sent events. This process prevents unauthorized push triggers and ensures authentication secrets are never leaked in push payloads.

Can I use web push notifications with Next.js and Vite for CometChat?

Yes, web push notifications work with Next.js, Vite, React Router, and Astro setups for CometChat. The implementation handles foreground versus background behavior, notification click navigation, and iOS Safari PWA-only constraints.

Do I need VAPID keys to set up CometChat web push notifications?

Yes, you need VAPID key generation to set up CometChat web push notifications. Production-grade guardrails require VAPID key separation alongside HTTPS or localhost compliance to securely establish browser push subscriptions.

Why are web push notifications not working on iOS Safari for my PWA?

Web push notifications on iOS Safari only work within a PWA context, which is a known platform constraint. You must ensure your web app meets PWA requirements and handles iOS Safari limitations for push alerts to function.

What is the best way to handle notification clicks to open a specific CometChat conversation?

The best way to handle notification clicks for CometChat is to focus an existing browser tab or open a new one to the correct chat thread. This click-through navigation ensures users land directly in the right conversation.