Question

试图找出如何获得史诗般的内容，它将订阅websocket，然后在发出的事件从websocket滚动时调度一些动作。

我看到的示例是使用多路复用而不实际调用websocket上的订阅，我对改变它感到困惑。

我已经开始这样了。但我相信redux observable想要一个

const socket$ = Observable.webSocket<DataEvent>(
  "ws://thewebsocketurl"
);

const bankStreamEpic = (action$, store) =>
  action$.ofType(START_BANK_STREAM).mergeMap(action => {
    console.log("in epic mergeMap");
    socket$
      .subscribe(
        e => {
          console.log("dispatch event " + e);
         distributeEvent(e);
        },
        e => {
          logger.log("AmbassadorsDataService", "Unclean socket closure");
        },
        () => {
          logger.log("AmbassadorsDataService", "Socket connection closed");
        }
      )
  });

   function distributeEvent(event: DataEvent) : void {
        //this.logger.log('AmbassadorsDataService', 'Event Received: ' + event.command + ' and id: ' + event.id);
        if(event.source === '/ambassadors/bank') {
            if( event.command === 'REMOVE') {
                removeDataEvent(event);
            }
            else if(event.command == 'ADD') {
                loadDataEvent(event);
            }
        }
    }

抛出错误： 未捕获的TypeError：您提供了＆＃39; undefined＆＃39;预期流的地方。您可以提供Observable，Promise，Array或Iterable。

任何帮助将不胜感激！

由于

Answer 1

在redux-observable中，你几乎永远不会（除非你知道为什么我说＆＃34;差不多＆＃34;）自己打电话给subscribe。相反，Observables被链接，中间件和其他运营商将为您处理订阅。

如果您想要做的只是为收到的每件事件发出一个动作，那很简单：

const socket$ = Observable.webSocket<DataEvent>(
  "ws://thewebsocketurl"
);

const bankStreamEpic = (action$, store) =>
  action$.ofType('START_BANK_STREAM')
    .mergeMap(action =>
      socket$
        .map(payload => ({
          type: 'BANK_STREAM_MESSAGE',
          payload
        }))
    );

您可能（或可能不）需要进行更多自定义，具体取决于从套接字收到的邮件内容是什么，但实际上您可以更好地将其他逻辑放在您的Reducer中因为它可能与副作用无关。

您可能想要一种方法来停止流，这只是一个takeUntil：

const socket$ = Observable.webSocket<DataEvent>(
  "ws://thewebsocketurl"
);

const bankStreamEpic = (action$, store) =>
  action$.ofType('START_BANK_STREAM')
    .mergeMap(action =>
      socket$
        .map(payload => ({
          type: 'BANK_STREAM_MESSAGE',
          payload
        }))
        .takeUntil(
          action$.ofType('STOP_BANK_STREAM')
        )
    );

我使用了mergeMap因为你做了，但在这种情况下我认为switchMap更贴切，因为每个都有多个这些似乎是多余的，除非你需要有多个而你的问题只是省略了一些东西每个人都很独特。

使用redux-observable并订阅websocket

1 个答案: