A Phoenix Channel implementation for Dart
Attempts to feature match the Javascript implementation found at phoenix.js
Much of the library is the same whether your code is running in the VM/Flutter or in a browser. Due to differences between the two platforms, the connection setup differs slightly.
import 'package:phoenix_wings/phoenix_wings.dart';
final socket = new PhoenixSocket("ws://localhost:4000/socket/websocket");
// equivalent to passing connectionProvider: PhoenixIoConnection.provider
// you can also pass params on connection if you for example want to authenticate using a user token like
final socket = PhoenixSocket("ws://localhost:4000/socket/websocket", socketOptions: PhoenixSocketOptions(params: {"user_token": 'user token here'}, ));Options that can be passed on connection include :-
- timeout - How long to wait for a response in miliseconds. Default 10000
- heartbeatIntervalMs - How many milliseconds between heartbeats. Default 30000
- reconnectAfterMs - Optional list of milliseconds between reconnect attempts
- params - Parameters sent to your Phoenix backend on connection.
import 'package:phoenix_wings/html.dart';
final socket = new PhoenixSocket("ws://localhost:4000/socket/websocket", connectionProvider: PhoenixHtmlConnection.provider);
await socket.connect();
final chatChannel = socket.channel("room:chat", {"id": "myId"});
chatChannel.on("user_entered", PhoenixMessageCallback (Map payload, String _ref, String, _joinRef) {
print(payload);
});
chatChannel.join();Mobile - when running the flutter example in your emulator, with the server also running in the same computer host, remember that the emulator is running in a segregated VM, so you need to configure it to point your server that is running on the host machine.
# check your IP configuration
$ ifconfig
enp0s20u5c4i2: flags=4163<UP,BROADCAST,RUNNING,MULTICAST> mtu 1500
inet 10.0.0.2 netmask 255.255.255.240 broadcast 172.20.10.15-
After checking your IP, go to your flutter Settings -> Proxy, and add the proxy host configuration with your IP, and port where your phoenix server with the websockets is listening.
-
Configure your flutter app to point to your phoenix websocket server.
final socket = PhoenixSocket("ws://10.0.0.2:4000/socket/websocket");
See here for an illustrated example.
Server - phoenix server with a channel that will communicate with the flutter app above.
Console - if you want to debug the websockets direclty, without phoenix_wings, using the phoenix protocol. See here for more info about the json protocol. You will have a lot of fun, connecting, and seeing the loop in this console app sending messages to your flutter app. To run, simply:
dart console.dart
Most of the tests are run on the VM. However, the PhoenixHtmlConnection tests must run in a browser.
By default tests will run on VM, Chrome and Firefox. This is set in dart_test.yaml
Tests are run via pub run test
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent