Opentok 反应本机不发布

Question

我正在尝试使用 opentok-react-native 库构建应用程序。

当应用程序运行时，发布者组件变为黑色方块，订阅者组件显示我的相机视频。

在日志中我可以看到流已创建，带有流 ID 并且显然正在运行。但是当我转到 Tokbox account 时，我在仪表板上看不到任何数据：

这是我当前的代码：https://github.com/victor0402/opentok-demo

重要的部分是：

import React, {Component} from 'react';
import {View} from 'react-native';
import {OT, OTPublisher, OTSession, OTSubscriber} from "opentok-react-native";

export default class App extends Component {

  //Publisher token
  token = 'TOKEN HERE';

  //Routed session ID
  session = 'SESSION ID HERE';

  apiKey = 'API KEY';

  constructor(props) {
    super(props);

    this.state = {
      streamProperties: {},
    };

    this.publisherProperties = {
      publishVideo: true,
      publishAudio: true,
      cameraPosition: 'front'
    };

    this.publisherEventHandlers = {
      streamCreated: event => {
        console.log('publisherEventHandlers: streamCreated.... updating state');
        const streamProperties = {
          ...this.state.streamProperties, [event.streamId]: {
            subscribeToAudio: true,
            subscribeToVideo: true,
            style: {
              width: 400,
              height: 300,
            },
          }
        };
        this.setState({streamProperties});
      },
      streamDestroyed: event => {
        console.log('Publisher stream destroyed!', event);
      }
    };

    this.subscriberProperties = {
      subscribeToAudio: true,
      subscribeToVideo: true,
    };

    this.sessionEventHandlers = {
      streamCreated: event => {
        console.log('sessionEventHandlers : streamCreated');
      },

      streamDestroyed: event => {
        console.log('Stream destroyed!!!!!!', event);
      },
    };

    this.subscriberEventHandlers = {
      error: (error) => {
        console.log(`There was an error with the subscriber: ${error}`);
      },
    };
  }

  render() {
    OT.enableLogs(true);

    return (
      <View>
        <OTSession apiKey={this.apiKey} sessionId={this.session} token={this.token}
                   eventHandlers={this.sessionEventHandlers}>

          <OTPublisher
            properties={this.publisherProperties}
            eventHandlers={this.publisherEventHandlers}
            style={{ height: 100, width: 100 }}
          />

          <OTSubscriber
            properties={this.subscriberProperties}
            eventHandlers={this.subscriberEventHandlers}
            style={{height: 100, width: 100}}
            streamProperties={this.state.streamProperties}
          />
        </OTSession>
      </View>

    );
  }
}

所以，我的代码有问题吗？如何发布视频并在我的帐户仪表板上获取结果和录音？

Answer 1

此处为 TokBox 开发人员布道师。

使用情况指标大约需要 24 小时才能填充到仪表板中，这就是您不会立即看到它们的原因。

我还查看了您共享的代码，看起来您在 OTPublisher 的 streamCreated 回调中设置了 streamProperties 对象。请注意，发布者的 streamCreated 事件只会在您的发布者开始发布时触发。由于您正在使用 streamProperties 为订阅者设置属性，因此您应该在 streamCreated 事件回调中为 OTSession 设置此数据，因为这是在新流（除了您的own) 在会话中创建。您的代码将如下所示：

this.sessionEventHandlers = {
  streamCreated: event => {
      const streamProperties = {
      ...this.state.streamProperties, [event.streamId]: {
        subscribeToAudio: true,
        subscribeToVideo: true,
        style: {
          width: 400,
          height: 300,
        },
      }
    };
    this.setState({streamProperties});
  },
};

最后，为了检查是否一切正常，我建议使用 OpenTok Playground Tool 并连接与 React Native 应用程序中相同的 sessionId。

Answer 2

希望您使用的是更新版本

"opentok-react-native": "^0.17.2"

Opentok 反应本机不发布

Opentok react native not publishing

react-native

opentok

tokbox