未处理的承诺拒绝ReferenceError:未定义文档

问题描述 投票:0回答:1

我试图在我的react-native项目中实现agora-rtm-sdk,但是一旦我登录agora,我就得到了这个文档未定义的问题。问题出在agora-rtm-sdk的index.js文件中。在创建实例或登录时,我看不到他们要求任何文档参数。

步骤:

  1. npm install agora-rtm-sdk --save
  2. 从'agora-rtm-sdk'导入AgoraRTM
  3. 创建的Agora实例
  4. 使用随机uid登录。

enter image description here

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,
                }}
            />
        )
    }


}
react-native chat agora.io
1个回答
0
投票

agora-rtm-sdk不能在React Native环境中使用。它旨在用于网站。因此,它将查找DOM的文档对象。

我建议您看看https://github.com/AgoraIO/agora-react-native-rtm

这具有用于React Native的Agora RTM实现。

© www.soinside.com 2019 - 2024. All rights reserved.