Flutter Pusher Websocket 包不起作用

Question

我有一個使用 Pusher 進行通知的后端 Laravel 應用程序。 我想在我的 Flutter 應用程序（iOS 和 Android）中顯示通知。 我發現https://pub.dev/packages/pusher_websocket_flutter/包的得分最高，但我無法讓它工作。 我已經按照本教程進行操作，並且沒有出現任何錯誤（無論我為 APP_KEY 輸入什么，都一定是錯誤的），但是我從未得到任何顯示。

有沒有人設法讓這個工作，或者我應該切換到firebase？

這是我的 pusher_service.dart：

import 'package:flutter/services.dart';
import 'package:pusher_websocket_flutter/pusher.dart';
import 'dart:async';

class PusherService {
  Event lastEvent;
  String lastConnectionState;
  Channel channel;

  StreamController<String> _eventData = StreamController<String>();
  Sink get _inEventData => _eventData.sink;
  Stream get eventStream => _eventData.stream;

  Future<void> initPusher() async {
    try {
      await Pusher.init('XXX', PusherOptions(cluster: 'XX'), enableLogging: true);
      print("Pusher initialized");
    }
    on PlatformException catch (e) {
       print(e.message);
    }
  }

  void connectPusher() {

    Pusher.connect(
        onConnectionStateChange: (ConnectionStateChange connectionState) async {
          lastConnectionState = connectionState.currentState;
          print("Pusher connected");
        }, onError: (ConnectionError e) {
      print("Error: ${e.message}");
    });
  }

  Future<void> subscribePusher(String channelName) async {
    channel = await Pusher.subscribe(channelName);
    print("Pusher subscribed to channel");
  }

  void unSubscribePusher(String channelName) {
    Pusher.unsubscribe(channelName);
  }

  void bindEvent(String eventName) {
    channel.bind(eventName, (last) {
      final String data = last.data;
      _inEventData.add(data);

    });
    print("Pusher data binded");
  }

  void unbindEvent(String eventName) {
    channel.unbind(eventName);
    _eventData.close();
  }

  Future<void> firePusher(String channelName, String eventName) async {
    await initPusher();
    connectPusher();
    await subscribePusher(channelName);
    bindEvent(eventName);
  }

}

我的 pusher_test.dart：

import 'package:flutter/material.dart';
import 'package:chalet/services/pusher_service.dart';
import 'package:pusher/pusher.dart';
import 'dart:async';

class PusherTest extends StatefulWidget {
  @override
  _PusherTestState createState() => _PusherTestState();
}

class _PusherTestState extends State<PusherTest> {

  PusherService pusherService = PusherService();
  @override
  void initState() {
    pusherService = PusherService();
    pusherService.firePusher('public', 'create');
    testPusher();
    super.initState();

  }

  @override
  void dispose() {
    pusherService.unbindEvent('create');
    super.dispose();
  }


  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: StreamBuilder(
          stream: pusherService.eventStream,
          builder: (BuildContext context, AsyncSnapshot snapshot) {
            if (!snapshot.hasData) {
              return CircularProgressIndicator();
          
            }
            return Container(
              child: Text(snapshot.data),
            );
          },
        ),
      ),
    );
  }
}

我已經檢查過，我的 snapshot.connectionState 一直在等待。

Answer 1

嘗試這個：

import 'dart:async';
import 'dart:convert';
import 'dart:developer';
import 'package:pusher_client/pusher_client.dart';

//instantiate Pusher Class

class PusherController {
  static final PusherController _pusherController =
      PusherController._internal();

  factory PusherController() {
    return _pusherController;
  }

  PusherController._internal();

  PusherClient pusher;
  Channel channel;
  StreamController<String> _eventData = StreamController<String>.broadcast();
  Sink get _inEventData => _eventData.sink;
  Stream get eventStream => _eventData.stream;
  String channelName = "";
  String prevChannelName = "";
  String eventName = "";

  void initPusher() {
    PusherOptions options = PusherOptions(
      cluster: "eu",
    );
    pusher = new PusherClient("key", options,
        autoConnect: true, enableLogging: true);
  }

  void setChannelName(String name) {
    channelName = name;
    print("channelName: ${channelName}");
  }

  void setEventName(String name) {
    eventName = name;
    print("eventName: ${eventName}");
  }

  void subscribePusher() {
    channel = pusher.subscribe(channelName);
    pusher.onConnectionStateChange((state) {
      log("previousState: ${state.previousState}, currentState: ${state.currentState}");
    });

    pusher.onConnectionError((error) {
      log("error: ${error.message}");
    });

    //Bind to listen for events called and sent to channel
    channel.bind(eventName, (PusherEvent event) {
      print("xxxxxxxxx From pusher xxxxxxxxx");
      print('xxxxx This is Event name - $eventName xxxx');
      print('xxxxx This is Event gotten - ${event.data} xxx');

      _inEventData.add(event.data);

      prevChannelName = eventName;
    });
  }


  void connectPusher() {
    pusher.connect();
  }

  void disconnectPusher() async {
    await channel.unbind(eventName);
    await pusher.disconnect();
  }
}

然后使用 streamBuilder 和來自 evenStream 的流。