Skills azure-web-pubsub-ts
📦

azure-web-pubsub-ts

Safe 🌐 Network access🔑 Env variables

Build Real-Time Apps with Azure Web PubSub

Implement WebSocket-based real-time messaging in your applications using Azure Web PubSub SDKs. This skill provides production-ready patterns for pub/sub messaging, group management, and connection handling with TypeScript.

Supports: Claude Codex Code(CC)
📊 70 Adequate
1

Download the skill ZIP

2

Upload in Claude

Go to Settings → Capabilities → Skills → Upload skill

3

Toggle on and start using

Test it

Using "azure-web-pubsub-ts". Generate client token with user ID and group membership

Expected outcome:

Token generated with URL wss://resource.webpubsub.azure.com/client/access/hubs/chat?access_token=xxx, userId=user123, groups=[chat-room], roles=[webpubsub.joinLeaveGroup, webpubsub.sendToGroup]

Using "azure-web-pubsub-ts". Send message to all users in chat-room group

Expected outcome:

Message broadcast successfully to 12 connections in group chat-room. Message content: {type: 'message', data: 'Hello everyone!'}

Security Audit

Safe
v1 • 2/25/2026

This skill contains legitimate Azure Web PubSub SDK documentation. Static analyzer produced 35 false positive external_commands findings by misinterpreting markdown code block backticks as shell execution. Network and environment variable patterns are standard Azure SDK usage. No malicious intent detected.

1
Files scanned
316
Lines analyzed
5
findings
1
Total audits
Medium Risk Issues (1)
SKILL.md:15-307
False Positive: External Command Detection
Static analyzer detected 35 instances of 'Ruby/shell backtick execution'. These are markdown code block delimiters in documentation, not actual shell command execution. No child_process or exec usage present.
Low Risk Issues (2)
SKILL.md:155-157
Standard Network Usage
fetch() call at line 155 is legitimate WebSocket negotiation pattern for Azure Web PubSub client connection. URL is relative endpoint '/negotiate', not external hardcoded URL.
SKILL.md:43-56
Standard Environment Variable Configuration
Environment variable access for WEBPUBSUB_CONNECTION_STRING and WEBPUBSUB_ENDPOINT follows Azure SDK best practices. These are configuration patterns, not credential leakage.

Risk Factors

🌐 Network access (2)
SKILL.md:155 SKILL.md:29-30
🔑 Env variables (3)
SKILL.md:43 SKILL.md:49 SKILL.md:56
Audited by: claude

Quality Score

38
Architecture
100
Maintainability
87
Content
31
Community
96
Security
91
Spec Compliance

What You Can Build

Real-Time Chat Application

Build a multi-room chat system with user authentication, group messaging, and presence indicators using Azure Web PubSub groups and user-targeted messaging.

Live Dashboard Updates

Push real-time data updates to connected dashboards using broadcast messaging. Ideal for monitoring systems, analytics displays, or live metrics visualization.

Multiplayer Game Lobby

Create game rooms with player matchmaking, in-game messaging, and session management using groups and connection management APIs.

Try These Prompts

Basic Setup 
Set up Azure Web PubSub server-side client using the connection string from environment variables. Create a hub named 'chat' and generate a basic client access token.
Authenticated Token Generation 
Generate a client access token for user 'user123' with roles for joining groups, sending to groups, and auto-join the 'chat-room' group. Set expiration to 60 minutes.
Client-Side Connection 
Create a WebPubSubClient that connects via a negotiate endpoint. Register handlers for connected, group-message, and disconnected events. Join the 'chat-room' group after connection.
Express Event Handler 
Implement an Express middleware handler for the 'chat' hub with handleConnect validation, handleUserEvent processing, and onConnected logging. Include a negotiate endpoint that generates tokens for authenticated users.

Best Practices

  • Use DefaultAzureCredential for production instead of access keys for better security
  • Register all event handlers before calling client.start() to avoid missing initial events
  • Validate authentication in handleConnect to reject unauthorized connections early in the handshake

Avoid

  • Hardcoding connection strings or access keys directly in source code instead of using environment variables
  • Accessing process.env variables without TypeScript non-null assertion or fallback values
  • Sending messages before verifying client connection state is 'connected'

Frequently Asked Questions

What is the difference between @azure/web-pubsub and @azure/web-pubsub-client?
@azure/web-pubsub is the server-side SDK for managing hubs, generating tokens, and sending messages. @azure/web-pubsub-client is the browser/Node.js client SDK for connecting to WebSocket endpoints and handling real-time messages.
How do I authenticate users with Azure Web PubSub?
Use either Azure Entra ID with DefaultAzureCredential (recommended for production) or generate tokens with userId and roles using the server SDK. Clients connect using the generated token URL.
What happens when a client disconnects unexpectedly?
Azure Web PubSub automatically attempts reconnection. Handle the 'disconnected' event for cleanup and 'rejoin-group-failed' to handle cases where group rejoin fails after reconnection.
Can I send messages to specific users versus all users?
Yes. Use sendToAll() for broadcast, sendToUser() for user-targeted messages (delivers to all their connections), or sendToConnection() for a specific connection ID.
How do groups work in Azure Web PubSub?
Groups are logical channels within a hub. Users can join/leave groups dynamically. Messages sent to a group reach all connections in that group. Useful for chat rooms, game lobbies, or topic-based subscriptions.
What is the negotiate endpoint pattern?
The negotiate endpoint is a server route that generates client access tokens. Clients call this endpoint to get a WebSocket URL with access token, then connect using that URL. This keeps credentials server-side.

Developer Details

Author

sickn33

License

MIT

Repository

https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/azure-web-pubsub-ts

Ref

main

File structure

📄 SKILL.md