搜尋套件、儲存庫與 APP 分類

套件詳情v1.0.2

phoenix_wings

Phoenix Channel 客戶端 for Dart

AndroidiOSmacOSWindowsLinux
近 30 天下載
478
喜歡數
13
Pub 分數
115

安裝套件

flutter pub add phoenix_wings

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

Phoenix Wings 是一個 Dart 客戶端,用於 Phoenix Channels,可讓 Flutter 應用實現即時通訊。它提供乾淨、反應式的介面,用於連接 Phoenix 伺服器、管理頻道並接收即時事件。專為與 Flutter 的狀態管理無縫整合而設計,支援訊息廣播、線上狀態追蹤以及強大的重連邏輯。非常適合建構聊天應用、即時儀表板和需要低延遲更新的協作工具。

適用情境

  • 即時聊天應用
  • 即時數據儀表板
  • 協作編輯工具
  • 存在檢測
  • 事件驅動的UI更新

主要特色

  • 反應式通道訂閱
  • 自動重連
  • 訊息廣播
  • 存在性追蹤
  • 清理Dart API

適合對象

  • Flutter 開發人員建構即時功能
  • 需要雙向通訊的應用程式
  • 使用 Phoenix Server 後端的專案

使用建議

  • 需要一個 Phoenix Server 實例
  • 限制為基於 WebSocket 的通訊
  • 可能需要額外的錯誤處理來應對特殊情況

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

Pub

phoenix_wings.dart

A Phoenix Channel implementation for Dart

Attempts to feature match the Javascript implementation found at phoenix.js

Usage

API Documentation

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 & Connection (VM/Flutter)
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 & Connection (HTML)
import 'package:phoenix_wings/html.dart';


final socket = new PhoenixSocket("ws://localhost:4000/socket/websocket", connectionProvider: PhoenixHtmlConnection.provider);

Common Usage
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();
Examples

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
  1. 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.

  2. 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

Testing

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

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。