Web applications and mobile apps increasingly need real-time communication. Features such as live chat, online gaming, real-time notifications, stock price updates, delivery tracking, collaborative editing, and live dashboards all depend on the ability to exchange data quickly between a client and a server.

Traditional HTTP communication works well when an application needs to request data from a server. However, continuously sending requests to check whether something has changed can be inefficient. This is where WebSockets become useful.

Dart provides built-in support for WebSocket programming through the dart:io library for native applications and servers. Flutter developers can also use WebSockets to build real-time mobile, desktop, and web applications.

In this guide, you will learn what WebSockets are, how WebSockets work, how to create a WebSocket server in Dart, how to connect a Dart client, send and receive messages, handle JSON data, manage connection errors, close connections properly, and use WebSockets effectively in Flutter applications.

---

What Is a WebSocket?

A WebSocket is a communication protocol that provides a persistent, two-way connection between a client and a server.

With a traditional HTTP request, the communication usually looks like this:

Client → Request → Server
Client ← Response ← Server

The client must make another request when it needs new information.

With WebSockets, the connection stays open:

Client ↔ WebSocket Connection ↔ Server

Both sides can send data whenever necessary.

For example, imagine a chat application.

With HTTP polling:

Client → "Do I have a new message?"
Server → "No"

Client → "Do I have a new message?"
Server → "No"

Client → "Do I have a new message?"
Server → "Yes, here is the message."

With WebSockets:

Client ←→ Server
          ↓
     New message
          ↓
Client receives it immediately

This makes WebSockets particularly useful for real-time applications.

---

Why Use WebSockets in Dart?

Dart is commonly used for Flutter development, and Flutter applications frequently require real-time functionality.

WebSockets can be useful for:

• Real-time chat
• Messaging applications
• Live notifications
• Online games
• Delivery tracking
• Ride-sharing applications
• Live sports scores
• Financial dashboards
• IoT applications
• Collaborative applications
• Real-time monitoring
• Live location updates
• Auction systems
• Customer support systems

For example, a Flutter delivery application could maintain a WebSocket connection with a backend server.

The server could send:

{
  "type": "driver_location",
  "latitude": 26.9124,
  "longitude": 75.7873
}

The Flutter application can immediately update the driver’s position on the map without repeatedly requesting the server.

---

WebSocket vs HTTP

Understanding the difference between HTTP and WebSockets is important.

Feature	HTTP	WebSocket
Connection	Request/response	Persistent
Communication	Usually client initiated	Both directions
Real-time communication	Limited	Excellent
Server can push data	Usually requires additional techniques	Yes
Overhead	Higher for repeated requests	Lower after connection
Best for	APIs and normal requests	Real-time applications

HTTP is still the right choice for many applications.

You should not automatically replace every REST API with WebSockets.

A common architecture is:

REST API
   ↓
Authentication
User profile
Products
Orders
Settings

WebSocket
   ↓
Chat
Notifications
Live tracking
Real-time events

This hybrid approach is often practical.

---

How WebSockets Work

A WebSocket connection begins with an HTTP-based handshake.

The client requests an upgrade from HTTP to WebSocket.

Conceptually:

Client
  |
  | HTTP Upgrade Request
  ↓
Server
  |
  | WebSocket Connection Accepted
  ↓
Client
  |
  |<====================>|
  | Persistent Connection |
  |<====================>|

After the handshake succeeds, the connection becomes a WebSocket connection.

The client and server can then exchange messages without repeatedly establishing new HTTP connections.

---

Dart WebSocket Support

Dart provides WebSocket functionality through the dart:io library.

For example:

import 'dart:io';

The WebSocket class can be used to create and manage WebSocket connections.

You can use Dart WebSockets in environments that support dart:io, such as:

• Dart server applications
• Flutter Android applications
• Flutter iOS applications
• Flutter desktop applications

For Flutter Web, browser WebSocket APIs are used instead of relying on dart:io.

---

Creating a WebSocket Server in Dart

Let’s create a simple WebSocket server.

import 'dart:io';

Future<void> main() async {
  final server = await HttpServer.bind(
    InternetAddress.anyIPv4,
    8080,
  );

  print('WebSocket server running on port 8080');

  await for (final request in server) {
    if (WebSocketTransformer.isUpgradeRequest(request)) {
      final socket = await WebSocketTransformer.upgrade(request);

      print('Client connected');

      socket.listen(
        (message) {
          print('Received: $message');

          socket.add('Server received: $message');
        },
        onDone: () {
          print('Client disconnected');
        },
      );
    } else {
      request.response
        ..statusCode = HttpStatus.badRequest
        ..write('WebSocket connection required')
        ..close();
    }
  }
}

This server listens on port 8080.

When a client requests a WebSocket connection, the HTTP connection is upgraded to a WebSocket connection.

---

Understanding the WebSocket Server Code

Let’s break the code into smaller pieces.

Import Dart IO

import 'dart:io';

This provides access to networking classes such as:

• HttpServer
• HttpRequest
• WebSocket
• InternetAddress

---

Start the Server

final server = await HttpServer.bind(
  InternetAddress.anyIPv4,
  8080,
);

This starts an HTTP server on port 8080.

The server listens on all IPv4 network interfaces.

---

Detect WebSocket Requests

if (WebSocketTransformer.isUpgradeRequest(request)) {

This checks whether the incoming HTTP request wants to upgrade to a WebSocket connection.

---

Upgrade the Connection

final socket = await WebSocketTransformer.upgrade(request);

The HTTP request is converted into a WebSocket connection.

Now the server can communicate with the client in both directions.

---

Listening for Messages

The server can listen for incoming messages using:

socket.listen(
  (message) {
    print('Received: $message');
  },
);

Whenever the client sends a message, the callback executes.

For example, if the client sends:

Hello Server

The server receives:

Hello Server

---

Sending Messages from the Server

The add() method sends data to the connected client.

socket.add('Hello Client');

The client receives the message.

For example:

socket.add('Welcome to the WebSocket server!');

---

Building a Simple Dart WebSocket Client

Dart can also act as a WebSocket client.

import 'dart:io';

Future<void> main() async {
  final socket = await WebSocket.connect(
    'ws://localhost:8080',
  );

  print('Connected to server');

  socket.listen(
    (message) {
      print('Received: $message');
    },
    onDone: () {
      print('Connection closed');
    },
  );

  socket.add('Hello from Dart client');
}

The client connects to:

ws://localhost:8080

and sends:

Hello from Dart client

The server can respond with:

Server received: Hello from Dart client

---

Understanding ws:// and wss://

There are two common WebSocket URL formats.

ws://

ws://example.com/socket

This is the non-secure WebSocket protocol.

It is generally suitable for local development.

wss://

wss://example.com/socket

This is the secure WebSocket protocol.

It uses TLS encryption, similar to HTTPS.

For production applications, you should normally use:

wss://

instead of:

ws://

---

Sending JSON Through WebSockets

Real applications usually need to exchange structured data rather than plain strings.

JSON is a common format.

Dart provides JSON encoding and decoding through:

import 'dart:convert';

Example:

final message = {
  'type': 'chat',
  'userId': 101,
  'text': 'Hello!',
};

socket.add(jsonEncode(message));

The client receives something like:

{
  "type": "chat",
  "userId": 101,
  "text": "Hello!"
}

---

Reading JSON Messages

You can decode received JSON like this:

socket.listen((message) {
  final data = jsonDecode(message);

  print(data['type']);
  print(data['text']);
});

For example:

chat
Hello!

This approach is much more useful than sending unstructured strings.

---

Designing WebSocket Events

A real-time application can define different event types.

For example:

{
  "type": "message",
  "data": {
    "text": "Hello"
  }
}

Another event could be:

{
  "type": "typing",
  "data": {
    "userId": 15
  }
}

Another:

{
  "type": "location_update",
  "data": {
    "latitude": 26.9124,
    "longitude": 75.7873
  }
}

The application can check the type field and process the event appropriately.

---

WebSocket Event Handling in Dart

A simple event handler might look like this:

void handleMessage(dynamic message) {
  final data = jsonDecode(message);

  switch (data['type']) {
    case 'message':
      handleChatMessage(data['data']);
      break;

    case 'typing':
      handleTypingEvent(data['data']);
      break;

    case 'location_update':
      handleLocationUpdate(data['data']);
      break;

    default:
      print('Unknown event');
  }
}

This pattern helps keep a real-time application organized.

---

Using WebSockets in Flutter

WebSockets are especially useful in Flutter applications.

A basic Flutter service can look like this:

import 'dart:convert';
import 'dart:io';

class WebSocketService {
  WebSocket? _socket;

  Future<void> connect() async {
    _socket = await WebSocket.connect(
      'wss://example.com/socket',
    );

    _socket!.listen(
      (message) {
        final data = jsonDecode(message);
        print(data);
      },
      onError: (error) {
        print('WebSocket error: $error');
      },
      onDone: () {
        print('WebSocket connection closed');
      },
    );
  }

  void sendMessage(Map<String, dynamic> data) {
    if (_socket != null) {
      _socket!.add(jsonEncode(data));
    }
  }

  void disconnect() {
    _socket?.close();
  }
}

You can then use this service from your Flutter application.

---

WebSocket Service Architecture in Flutter

A good Flutter project should avoid placing WebSocket logic directly inside UI widgets.

Instead, use a service or repository layer.

For example:

Flutter App
    ↓
Controller / ViewModel
    ↓
WebSocket Service
    ↓
WebSocket Server

This makes the application easier to maintain.

For larger projects:

UI
 ↓
Controller
 ↓
Repository
 ↓
WebSocket Service
 ↓
Network

This architecture works well with state-management solutions such as GetX, Riverpod, Bloc, or Provider.

---

WebSocket Authentication

Real-world WebSocket connections often require authentication.

For example, the application may need to send an authentication token when connecting.

A connection URL might look like:

wss://example.com/socket?token=YOUR_TOKEN

However, avoid exposing sensitive credentials unnecessarily.

Another common approach is to authenticate during the WebSocket handshake or immediately after connecting.

For example:

{
  "type": "authenticate",
  "token": "YOUR_ACCESS_TOKEN"
}

The server can validate the token and either accept or reject the connection.

---

Handling Connection Errors

Network connections can fail.

Your application should handle:

• Internet disconnection
• Server downtime
• Invalid authentication
• Connection timeout
• Unexpected server errors
• Connection termination

Example:

socket.listen(
  (message) {
    print(message);
  },
  onError: (error) {
    print('WebSocket error: $error');
  },
  onDone: () {
    print('WebSocket disconnected');
  },
);

Never assume that a WebSocket connection will remain open forever.

---

WebSocket Reconnection

Mobile applications frequently move between networks.

For example:

Wi-Fi
  ↓
Mobile Data
  ↓
Wi-Fi

The connection may be interrupted.

A production application should implement reconnection logic.

A simple approach:

Future<void> connectWithRetry() async {
  while (true) {
    try {
      await connect();
      break;
    } catch (e) {
      print('Connection failed: $e');

      await Future.delayed(
        const Duration(seconds: 5),
      );
    }
  }
}

In production, consider using exponential backoff instead of retrying continuously at a fixed interval.

For example:

1 second
2 seconds
4 seconds
8 seconds
16 seconds

This reduces unnecessary network traffic when a server is unavailable.

---

Sending Heartbeat Messages

Long-lived connections sometimes need heartbeat or ping/pong mechanisms.

A heartbeat helps determine whether the connection is still active.

For example:

{
  "type": "ping"
}

The server could respond:

{
  "type": "pong"
}

The exact implementation depends on the WebSocket server and protocol architecture.

Heartbeat mechanisms are particularly useful for applications where connections must remain active for long periods.

---

Closing a WebSocket Connection

When the connection is no longer needed, close it properly.

await socket.close();

You can also provide a close code and reason when appropriate:

await socket.close(
  WebSocketStatus.normalClosure,
  'Client disconnected',
);

Properly closing connections helps avoid unnecessary resource usage.

---

WebSocket Connection Lifecycle

A typical WebSocket lifecycle looks like this:

Disconnected
     ↓
Connecting
     ↓
Connected
     ↓
Listening / Sending
     ↓
Connection Interrupted
     ↓
Reconnecting
     ↓
Connected

Your Flutter application should manage these states explicitly.

For example:

enum ConnectionState {
  disconnected,
  connecting,
  connected,
  reconnecting,
}

This allows the UI to display appropriate information.

---

Building a Chat Application with Dart WebSockets

One of the most common WebSocket use cases is chat.

Suppose a user sends:

Hello!

The Flutter application could send:

{
  "type": "chat_message",
  "conversationId": "123",
  "senderId": "10",
  "message": "Hello!"
}

The server receives the event and forwards it to the appropriate recipient.

The recipient receives:

{
  "type": "chat_message",
  "conversationId": "123",
  "senderId": "10",
  "message": "Hello!"
}

The Flutter UI then adds the message to the chat list.

---

WebSockets for Live Notifications

WebSockets can also deliver notifications immediately.

For example:

{
  "type": "notification",
  "title": "New Order",
  "message": "You received a new order."
}

The application can update the notification count without refreshing the screen.

For mobile applications, however, WebSockets should not automatically replace push notification systems.

When an app is completely closed or the operating system suspends it, a WebSocket connection may not remain active. Push notifications such as Firebase Cloud Messaging can be more appropriate for background notification delivery.

A common architecture is:

App Open
   ↓
WebSocket
   ↓
Real-time events

App Background / Closed
   ↓
Push Notification
   ↓
FCM / APNs

---

WebSockets for Live Location Tracking

WebSockets are useful for applications such as:

• Ride-sharing
• Food delivery
• Logistics
• Fleet management
• Field-service applications

For example, a driver application can send:

{
  "type": "location",
  "driverId": "D100",
  "latitude": 26.9124,
  "longitude": 75.7873
}

The server can distribute the location to the customer application.

The customer’s map can then update in real time.

However, location updates should be carefully optimized. Sending location data every second for every connected user can become expensive and inefficient.

Consider:

• Update intervals
• Distance thresholds
• Battery usage
• Network availability
• Server load
• Number of connected users

---

WebSockets for Real-Time Dashboards

Business dashboards can also benefit from WebSockets.

Imagine an admin dashboard displaying:

Orders Today: 1,245
Pending Orders: 32
Active Drivers: 86
Revenue: ₹4,52,000

Instead of refreshing the dashboard every few seconds, the backend can push updates.

For example:

{
  "type": "dashboard_update",
  "data": {
    "orders": 1245,
    "pendingOrders": 32,
    "activeDrivers": 86
  }
}

The Flutter or web dashboard can immediately update its state.

---

WebSocket Security Best Practices

Security is extremely important when implementing WebSockets.

Use Secure WebSockets

Production applications should generally use:

wss://

instead of:

ws://

This encrypts communication between the client and server.

---

Authenticate Connections

Do not allow unauthorized users to access private real-time channels.

Use secure authentication mechanisms and validate tokens on the server.

---

Validate Incoming Data

Never blindly trust data received from clients.

For example:

final data = jsonDecode(message);

does not mean that data is safe.

The server should validate:

• Message type
• Required fields
• Data types
• User permissions
• Message size
• Resource access

---

Avoid Sensitive Information in Logs

Do not log:

password
access tokens
private keys
payment information

especially in production.

---

Protect Against Abuse

A WebSocket server should consider:

• Rate limiting
• Connection limits
• Message size limits
• Authentication expiration
• Authorization
• Idle connection management

A malicious client should not be able to consume unlimited server resources.

---

WebSocket Performance Considerations

WebSockets are efficient, but they still require careful architecture.

Don’t Send Unnecessary Data

Instead of sending a complete object every time:

{
  "id": 100,
  "name": "John",
  "email": "john@example.com",
  "address": "...",
  "profile": "..."
}

you may only need to send:

{
  "type": "status_update",
  "id": 100,
  "status": "online"
}

Smaller messages reduce bandwidth.

---

Use Appropriate Update Frequencies

For live tracking, sending data every 100 milliseconds may be unnecessary.

A carefully selected interval can significantly reduce:

• Battery consumption
• Network usage
• Server load
• Client processing

---

WebSockets and REST APIs Together

WebSockets and REST APIs are not competitors.

They can work together.

For example:

Flutter Application
       |
       +------ REST API
       |        |
       |        +-- Login
       |        +-- Products
       |        +-- Orders
       |        +-- User profile
       |
       +------ WebSocket
                |
                +-- Chat
                +-- Live notifications
                +-- Tracking
                +-- Real-time status

This architecture is common because each technology is used where it provides the most value.

---

Common WebSocket Mistakes

1. Using WebSockets for Everything

Not every feature requires real-time communication.

A normal REST API is often better for simple CRUD operations.

---

2. Ignoring Reconnection

Mobile networks are unreliable.

Always consider what happens when the connection disappears.

---

3. Not Handling Authentication

A WebSocket endpoint should not automatically be treated as public.

Protect private resources.

---

4. Sending Too Many Messages

High-frequency updates can increase server and battery usage.

Only send information when necessary.

---

5. Forgetting to Close Connections

Always close connections when they are no longer required.

---

6. Mixing WebSocket Logic with UI Code

Avoid putting all networking logic inside a Flutter widget.

Use a service, repository, controller, or similar architecture.

---

Testing a Dart WebSocket Application

You can test WebSocket applications using several approaches.

Test the Dart server

Run:

dart run

Then start your client.

Test connectivity

Use a WebSocket-compatible testing tool or a small Dart client.

Test failure scenarios

Do not test only the successful connection.

Also test:

• Server unavailable
• Internet disconnected
• Invalid token
• Server restart
• Duplicate connection
• Large message
• Unexpected disconnect
• Reconnection

These tests are particularly important for mobile applications.

---

Dart WebSocket Best Practices

Here are some practical recommendations:

1. Use wss:// in production.
2. Authenticate WebSocket connections.
3. Validate all incoming messages.
4. Define a consistent event format.
5. Handle connection errors.
6. Implement reconnection logic.
7. Use heartbeat mechanisms where necessary.
8. Close connections properly.
9. Avoid excessive message frequency.
10. Keep WebSocket code separate from UI code.
11. Monitor active connections on the server.
12. Implement rate limits.
13. Keep messages small.
14. Log useful diagnostic information without exposing secrets.
15. Use REST APIs for features that do not require real-time communication.

---

Recommended WebSocket Message Structure

A consistent message format makes your application easier to maintain.

For example:

{
  "event": "message",
  "requestId": "abc123",
  "timestamp": "2026-08-21T10:30:00Z",
  "data": {
    "message": "Hello"
  }
}

For an error:

{
  "event": "error",
  "requestId": "abc123",
  "data": {
    "code": "UNAUTHORIZED",
    "message": "Authentication failed"
  }
}

A consistent protocol becomes increasingly important as your application grows.

---

When Should You Use Dart WebSockets?

Use WebSockets when the application genuinely needs low-latency, bidirectional communication.

Good examples include:

• Chat applications
• Multiplayer games
• Live tracking
• Real-time dashboards
• Collaborative editing
• Live notifications
• Trading interfaces
• Real-time monitoring

For a simple application that only needs to retrieve data occasionally, REST APIs are usually simpler.

---

Dart WebSockets vs Other Real-Time Technologies

Depending on your backend architecture, alternatives may include:

• WebSockets
• Server-Sent Events
• Firebase Realtime Database
• Cloud Firestore listeners
• MQTT
• Long polling

WebSockets are particularly useful when both client and server need to send messages over a persistent connection.

For Flutter applications, the best solution depends on your backend, scalability requirements, offline requirements, authentication architecture, and expected number of concurrent users.

---

Complete Simple Dart WebSocket Example

Here is a compact server example combining the major concepts:

import 'dart:convert';
import 'dart:io';

Future<void> main() async {
  final server = await HttpServer.bind(
    InternetAddress.anyIPv4,
    8080,
  );

  print('Server started on port 8080');

  await for (final request in server) {
    if (!WebSocketTransformer.isUpgradeRequest(request)) {
      request.response
        ..statusCode = HttpStatus.badRequest
        ..write('WebSocket connection required');

      await request.response.close();
      continue;
    }

    final socket = await WebSocketTransformer.upgrade(request);

    print('Client connected');

    socket.listen(
      (message) {
        try {
          final data = jsonDecode(message);

          print('Event: ${data['event']}');

          socket.add(
            jsonEncode({
              'event': 'response',
              'data': {
                'message': 'Message received successfully',
              },
            }),
          );
        } catch (e) {
          socket.add(
            jsonEncode({
              'event': 'error',
              'data': {
                'message': 'Invalid JSON message',
              },
            }),
          );
        }
      },
      onError: (error) {
        print('Socket error: $error');
      },
      onDone: () {
        print('Client disconnected');
      },
    );
  }
}

This example demonstrates:

• WebSocket server creation
• Connection upgrades
• Incoming message handling
• JSON decoding
• JSON responses
• Error handling
• Connection closing

---

Frequently Asked Questions

What is WebSocket programming in Dart?

Dart WebSocket programming allows applications to establish persistent, two-way communication between a client and a server. It is useful for real-time applications such as chat, notifications, tracking, and live dashboards.

Does Dart support WebSockets?

Yes. Dart provides WebSocket support through its networking libraries, including the WebSocket class available through dart:io for supported environments.

Can WebSockets be used with Flutter?

Yes. Flutter applications can use WebSockets for real-time communication. The implementation depends on the target platform, particularly when targeting the browser.

Is WebSocket better than REST API?

Neither is universally better. REST is excellent for standard request/response APIs, while WebSockets are better suited to persistent, real-time, bidirectional communication.

Should I use WebSockets for chat?

WebSockets are a strong option for real-time chat when your backend supports them. You should also consider authentication, reconnection, message persistence, offline behavior, and push notifications.

What is the difference between ws and wss?

ws:// is the non-secure WebSocket protocol, while wss:// uses TLS encryption. Production applications should generally use wss://.

Does WebSocket work when a Flutter app is closed?

You should not assume that a WebSocket remains active when a mobile application is fully closed or suspended. For background notifications, platform push notification services are generally more appropriate.

---

Conclusion

Dart WebSocket programming provides a powerful way to build real-time applications with persistent, bidirectional communication.

Instead of repeatedly requesting the server for updates, a WebSocket connection allows the server to push information to the client as soon as an event occurs. This makes WebSockets useful for chat applications, live tracking, real-time dashboards, notifications, multiplayer applications, and many other modern systems.

For Flutter developers, WebSockets can become an important part of a larger application architecture. A strong implementation should not only establish a connection but also handle authentication, JSON messages, errors, reconnection, heartbeat mechanisms, security, performance, and proper connection lifecycle management.

The most practical approach is usually to combine technologies:

REST API
   ↓
Standard application data

WebSocket
   ↓
Real-time events

Push Notifications
   ↓
Background / offline notifications

Once you understand these concepts, you can build much more responsive Flutter and Dart applications that communicate with backend systems in real time.