react-native-opentok
react-native-opentok copied to clipboard
[Question] How publisher and subscriber components works?
Hey!
I'm trying to figure out how <Publisher> and <Subscriber> works. Because when these components are rendered the onPublishStart / onSubscribeStartevent never called.
Should I call a method to start the streaming?
My code is:
import React, { Component } from 'react';
import { View } from 'react-native';
import { Container, Button, Text, Item, Input } from 'native-base';
import OpenTok, { Publisher, Subscriber } from 'react-native-opentok';
import Header from '../common/Header';
import { containerStyle, buttonStyle, textStyle } from './styles';
const sessionId = 'SESSION_ID';
const token = 'TOKEN_ID';
class StartSession extends Component {
//Testing purposes
async componentWillMount() {
console.log('Start session method');
const isConnected = await OpenTok.connect(sessionId, token);
console.log('Volvio del connect: ', isConnected);
OpenTok.on(OpenTok.events.ON_SIGNAL_RECEIVED, e => console.log(e));
}
async sendSignal() {
console.log('Sending signal');
const isSent = await OpenTok.sendSignal(sessionId, 'message', 'a');
console.log('Signal sent: ', isSent);
}
render() {
return (
<Container>
<Header title="Start a session" subtitle="Name the session" />
<View style={containerStyle}>
<Item regular>
<Input placeholder="Name of this session" />
</Item>
{/* <Button block style={buttonStyle} onPress={() => this.startSession()}>
<Text style={textStyle}>Start the Session</Text>
</Button> */}
<Button block style={buttonStyle} onPress={() => this.sendSignal()}>
<Text style={textStyle}>Send signal</Text>
</Button>
<Publisher
sessionId={sessionId}
onPublishStart={() => {
console.log('publish started');
}}
onPublishStop={() => {
console.log('publish stoped');
}}
style={{ height: 100, width: 200, backgroundColor: 'red' }}
ref={ref => {
this.publisherRef = ref;
}}
/>
<Subscriber
style={{ height: 100, width: 200, backgroundColor: 'blue' }}
sessionId={sessionId}
onSubscribeStart={() => {
console.log('subscription started');
}}
onSubscribeStop={() => {
console.log('subscription stopped');
}}
/>
</View>
</Container>
);
}
}
export default StartSession;
FYI:
- The
sendSignal()function is working. I can seeSignal sent: truein my console. However, I'm not receiving any data in theON_SIGNAL_RECEIVEDevent.
Thanks in advance!