• Stars
    star
    663
  • Rank 67,599 (Top 2 %)
  • Language
    Dart
  • License
    MIT License
  • Created over 7 years ago
  • Updated about 1 month ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

socket.io-client-dart: Dartlang port of socket.io-client https://github.com/socketio/socket.io-client

socket.io-client-dart

Port of awesome JavaScript Node.js library - Socket.io-client v2.0.1~v3.0.3 - in Dart

Version info:

socket.io-client-dart Socket.io Server
v0.9.* ~ v1.* v2.*
v2.* v3.* & v4.*

Usage

Dart Server

import 'package:socket_io/socket_io.dart';

main() {
  // Dart server
  var io = Server();
  var nsp = io.of('/some');
  nsp.on('connection', (client) {
    print('connection /some');
    client.on('msg', (data) {
      print('data from /some => $data');
      client.emit('fromServer', "ok 2");
    });
  });
  io.on('connection', (client) {
    print('connection default namespace');
    client.on('msg', (data) {
      print('data from default => $data');
      client.emit('fromServer', "ok");
    });
  });
  io.listen(3000);
}

Dart Client

import 'package:socket_io_client/socket_io_client.dart' as IO;

main() {
  // Dart client
  IO.Socket socket = IO.io('http://localhost:3000');
  socket.onConnect((_) {
    print('connect');
    socket.emit('msg', 'test');
  });
  socket.on('event', (data) => print(data));
  socket.onDisconnect((_) => print('disconnect'));
  socket.on('fromServer', (_) => print(_));
}

Connect manually

To connect the socket manually, set the option autoConnect: false and call .connect().

For example,

Socket socket = io('http://localhost:3000', 
    OptionBuilder()
      .setTransports(['websocket']) // for Flutter or Dart VM
      .disableAutoConnect()  // disable auto-connection
      .setExtraHeaders({'foo': 'bar'}) // optional
      .build()
  );
socket.connect();

Note that .connect() should not be called if autoConnect: true (by default, it's enabled to true), as this will cause all event handlers to get registered/fired twice. See Issue #33.

Update the extra headers

Socket socket = ... // Create socket.
socket.io.options['extraHeaders'] = {'foo': 'bar'}; // Update the extra headers.
socket.io..disconnect()..connect(); // Reconnect the socket manually.

Emit with acknowledgement

Socket socket = ... // Create socket.
socket.onConnect((_) {
    print('connect');
    socket.emitWithAck('msg', 'init', ack: (data) {
        print('ack $data') ;
        if (data != null) {
          print('from server $data');
        } else {
          print("Null") ;
        }
    });
});

Socket connection events

These events can be listened on.

const List EVENTS = [
  'connect',
  'connect_error',
  'connect_timeout',
  'connecting',
  'disconnect',
  'error',
  'reconnect',
  'reconnect_attempt',
  'reconnect_failed',
  'reconnect_error',
  'reconnecting',
  'ping',
  'pong'
];

// Replace 'onConnect' with any of the above events.
socket.onConnect((_) {
    print('connect');
});

Acknowledge with the socket server that an event has been received.

socket.on('eventName', (data) {
    final dataList = data as List;
    final ack = dataList.last as Function;
    ack(null);
});

Usage (Flutter)

In Flutter env. not (Flutter Web env.) it only works with dart:io websocket, not with dart:html websocket or Ajax (XHR), so in this case you have to add setTransports(['websocket']) when creates the socket instance.

For example,

IO.Socket socket = IO.io('http://localhost:3000',
  OptionBuilder()
      .setTransports(['websocket']) // for Flutter or Dart VM
      .setExtraHeaders({'foo': 'bar'}) // optional
      .build());

Usage with stream and streambuilder in Flutter

import 'dart:async';


// STEP1:  Stream setup
class StreamSocket{
  final _socketResponse= StreamController<String>();

  void Function(String) get addResponse => _socketResponse.sink.add;

  Stream<String> get getResponse => _socketResponse.stream;

  void dispose(){
    _socketResponse.close();
  }
}

StreamSocket streamSocket =StreamSocket();

//STEP2: Add this function in main function in main.dart file and add incoming data to the stream
void connectAndListen(){
  IO.Socket socket = IO.io('http://localhost:3000',
      OptionBuilder()
       .setTransports(['websocket']).build());

    socket.onConnect((_) {
     print('connect');
     socket.emit('msg', 'test');
    });

    //When an event recieved from server, data is added to the stream
    socket.on('event', (data) => streamSocket.addResponse);
    socket.onDisconnect((_) => print('disconnect'));

}

//Step3: Build widgets with streambuilder

class BuildWithSocketStream extends StatelessWidget {
  const BuildWithSocketStream({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: StreamBuilder(
        stream: streamSocket.getResponse ,
        builder: (BuildContext context, AsyncSnapshot<String> snapshot){
          return Container(
            child: snapshot.data,
          );
        },
      ),
    );
  }
}

Troubleshooting

Cannot connect "https" server or self-signed certificate server

class MyHttpOverrides extends HttpOverrides {
  @override
  HttpClient createHttpClient(SecurityContext? context) {
    return super.createHttpClient(context)
      ..badCertificateCallback =
          (X509Certificate cert, String host, int port) => true;
  }
}

void main() {
  HttpOverrides.global = MyHttpOverrides();
  runApp(MyApp());
}

Memory leak issues in iOS when closing socket.

  • Refer to #108 issue. Please use socket.dispose() instead of socket.close() or socket.disconnect() to solve the memory leak issue on iOS.

Connect_error on MacOS with SocketException: Connection failed

By adding the following key into the to file *.entitlements under directory macos/Runner/

<key>com.apple.security.network.client</key>
<true/>

For more details, please take a look at https://flutter.dev/desktop#setting-up-entitlements

Can't connect socket server on Flutter with Insecure HTTP connection

The HTTP connections are disabled by default on iOS and Android, so here is a workaround to this issue, which mentioned on stack overflow

Notes to Contributors

Fork socket.io-client-dart

If you'd like to contribute back to the core, you can fork this repository and send us a pull request, when it is ready.

If you are new to Git or GitHub, please read this guide first.

Contribution of all kinds is welcome. Please read Contributing.md in this repository.

Who Uses

  • Quire - a simple, collaborative, multi-level task management tool.
  • KEIKAI - a web spreadsheet for Big Data.

Socket.io Dart Server

Contributors

More Repositories

1

stream

Lightweight Dart web server. Features: request routing, filtering, template engine, WebSocket, MVC design pattern, and file-based static resources.
Dart
233
star
2

ui

Rikulo UI is a cross-platform framework for creating amazing Web and mobile applications in Dart and HTML 5.
Dart
208
star
3

socket.io-dart

socket.io-dart: Dartlang port of socket.io https://github.com/socketio/socket.io
Dart
121
star
4

bootjack

Twitter Bootstrap ported in Dart.
Dart
88
star
5

dquery

jQuery ported in Dart.
Dart
53
star
6

gap

A bridge implementation of the Apache Cordova mobile framework(a.k.a. PhoneGap) in Dart. It enables developers to access native facilities of multiple mobile platforms using the HTML, CSS, and Dart.
Dart
31
star
7

stomp

STOMP Dart Client for communicating with STOMP-compliant messaging servers.
Dart
30
star
8

entity

A simple ORM for Relational and NoSQL database
Dart
23
star
9

bootjack-datepicker

Date picker for Bootjack
Dart
17
star
10

commons

Common reusable Dart classes and utilities.
Dart
12
star
11

ripple

Lightweight Dart messaging server; supporting STOMP messaging protocol.
Dart
11
star
12

security

A lightweight and highly customizable authentication and access-control framework for Rikulo Stream.
Dart
10
star
13

couchclient

Couchbase Dart Client Library
Dart
10
star
14

el

Rikulo EL (Expression Language) is an implementation of the Unified Expression Language specification plus some enhancements for and in Dart.
Dart
10
star
15

highcharts

Dart
9
star
16

memcached-client

Memcached Dart Client Library
Dart
9
star
17

todoMVC

A todoMVC implementation written with Rikulo and in Dart
CSS
8
star
18

rikulo-docs

Rikulo Documentation
Java
6
star
19

socket_io_common

Socket.io common parser library for Dart 2
Dart
5
star
20

uxl

Rikulo UXL (User-interface eXtensible Language) is a markup language allowing developers to define user-interface in XML, and then compile and debug it in Dart.
Dart
5
star
21

diff-match-patch

A port of Google Diff Match and Patch library to Dart
Dart
4
star
22

orm

[Suspended] Rikulo ORM is an object-relational mapping (ORM) library for Dart language.
Dart
4
star
23

jison2dart

Generate Dart parsers using Jison - Bison/Yacc in JavaScript
Dart
4
star
24

xml-crypto

Xml digital signature library for Dart
Dart
4
star
25

gapi

Rikulo GAPI is a Dart bridge to those frequently used on-line JavaScript services provided by Google.
Dart
3
star
26

geoip

Rikulo GeoIP is a Dart bridge to the on-line geo-ip JavaScript service provided by smart-ip.net.
Dart
3
star
27

rikulo-blog

Rikulo Blogs
JavaScript
3
star
28

eul

[Deprecated] Rikulo EUL (Embeddable User-interface Language) is a markup language allowing developers to define user-interface in HTML 5 and XML. EUL is embeddable in Dart code or HTML pages.
Dart
2
star
29

access

A simple database utility
Dart
2
star
30

yapi

Rikulo YAPI is a Dart bridge to those frequently used on-line JavaScript services provided by Yahoo Inc.
Dart
2
star
31

rikulo-website

The website for Rikulo
CSS
1
star