我试图在我的react-native项目中实现agora-rtm-sdk,但是一旦我登录agora,我就得到了这个文档未定义的问题。问题出在agora-rtm-sdk的index.js文件中。在创建实例或登录时,我看不到他们要求任何文档参数。
步骤:
import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, ScrollView, ActivityIndicator, AppState, SafeAreaView, Alert, TouchableOpacity, Dimensions, ToastAndroid, Image, Modal, Keyboard, BackHandler } from 'react-native';
import { StackActions, NavigationActions, NavigationEvents } from 'react-navigation';
import AgoraRTM from 'agora-rtm-sdk'
var { height, width } = Dimensions.get('window');
import { Observable } from 'rxjs';
import Utils from '../../customClass/Utils';
import { GiftedChat } from 'react-native-gifted-chat'
const resetAction = StackActions.reset({
index: 1,
actions: [
NavigationActions.navigate({ routeName: 'SplashScreen' }),
NavigationActions.navigate({ routeName: 'Login' }),
],
});
const BannerWidth = Dimensions.get('window').width;
const BannerHeight = 220;
const client = null;
type Props = {};
export default class Chats extends Component {
constructor(props) {
super(props);
this.state = {
messages: [],
uid: 'sheena123456789',
APP_ID: 'd64ba76480a24475a0f4bc18ccb6ff85'
};
this.client = AgoraRTM.createInstance(this.state.APP_ID);
}
getBasicDetails() {
const { navigation } = this.props;
const session = navigation.getParam('session', null);
this.customClass = new Utils();
const observe = new Observable(subscriber => {
this.customClass.getSessionData(session, subscriber, this)
});
observe.subscribe(sessionData => {
this.setState({
accessToken: sessionData.accessToken,
patientId: sessionData.patientId,
en: sessionData.en
});
}
);
this.client.on('ConnectionStateChange', (newState, reason) => {
console.log('on connection state changed to ' + newState + ' reason: ' + reason);
});
this.client.login({ token: null, uid: this.state.uid }).then(() => {
console.log('AgoraRTM client login success');
}).catch(err => {
console.log('AgoraRTM client login failure', err);
});
this.setState({
messages: [
{
_id: 1,
text: 'Hello developer',
createdAt: new Date(),
user: {
_id: 2,
name: 'React Native',
avatar: 'https://placeimg.com/140/140/any',
},
},
]
});
}
UNSAFE_componentWillMount() {
BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
}
componentWillUnmount() {
BackHandler.removeEventListener('hardwareBackPress', this.handleBackPress);
}
componentDidMount() {
this.getBasicDetails();
}
handleBackPress = () => {
this.goBack();
return true;
}
goBack() {
this.props.navigation.goBack();
}
onSend(messages = []) {
this.client.sendMessageToPeer(
{ text: 'test peer message' }, // An RtmMessage object.
'DigiQure', // The user ID of the remote user.
).then(sendResult => {
if (sendResult.hasPeerReceived) {
this.setState(previousState => ({
messages: GiftedChat.append(previousState.messages, messages),
}))
/* Your code for handling the event that the remote user receives the message. */
} else {
/* Your code for handling the event that the message is received by the server but the remote user cannot be reached. */
}
}).catch(error => {
/* Your code for handling the event of a message send failure. */
});
}
render() {
return (
<GiftedChat
messages={this.state.messages}
onSend={messages => this.onSend(messages)}
user={{
_id: 1,
}}
/>
)
}
}
agora-rtm-sdk
不能在React Native环境中使用。它旨在用于网站。因此,它将查找DOM的文档对象。
我建议您看看https://github.com/AgoraIO/agora-react-native-rtm
这具有用于React Native的Agora RTM实现。