代码之家  ›  专栏  ›  技术社区  ›  redoc01

React Native-requireNativeComponent:在UIManager中找不到“RTCDeoView”

  •  0
  • redoc01  · 技术社区  · 4 年前

    这是我的代码:

                import React, { Component } from 'react';
                // import { Platform } from 'react-native';
                import {
                    RTCPeerConnection,
                    RTCMediaStream,
                    RTCIceCandidate,
                    RTCSessionDescription,
                    RTCView,
                    MediaStreamTrack,
                    getUserMedia,
                } from 'react-native-webrtc';
    
                class App extends Component {
                    // Initial state
                    state = {
                        videoURL: null,
                        isFront: true
                    }
    
                    componentDidMount() {
                        const configuration = { "iceServers": [{ "url": "stun:stun.l.google.com:19302" }] };
                        const pc = new RTCPeerConnection(configuration);
                        const { isFront } = this.state;
                        MediaStreamTrack.getSources(sourceInfos => {
                            console.log('MediaStreamTrack.getSources', sourceInfos);
                            let videoSourceId;
                            for (let i = 0; i < sourceInfos.length; i++) {
                                const sourceInfo = sourceInfos[i];
                                // I like ' than "
                                if (sourceInfo.kind === 'video' && sourceInfo.facing === (isFront ? 'front' : 'back')) {
                                    videoSourceId = sourceInfo.id;
                                }
                            }
                            getUserMedia({
                                audio: true,
                                // THIS IS FOR SIMULATOR ONLY
                                // In fact, you better test on real iOS/Android device
                                // We just can test audio on simulator, so i set video = false
                                // video: Platform.OS === 'ios' ? false : {
                                video: {
                                    mandatory: {
                                        minWidth: 500, // Provide your own width, height and frame rate here
                                        minHeight: 300,
                                        minFrameRate: 30
                                    },
                                    facingMode: (isFront ? 'user' : 'environment'),
                                    optional: (videoSourceId ? [{ sourceId: videoSourceId }] : [])
                                }
                            }, (stream) => {
                                // use arrow function :)
                                // (stream) or stream are fine
                                console.log('Streaming OK', stream);
                                this.setState({
                                    videoURL: stream.toURL()
                                });
                                pc.addStream(stream);
                            }, error => {
                                console.log('Oops, we getting error', error.message);
                                throw error;
                            });
                        });
                        pc.createOffer((desc) => {
                            pc.setLocalDescription(desc, () => {
                                // Send pc.localDescription to peer
                                console.log('pc.setLocalDescription');
                            }, (e) => { throw e; });
                        }, (e) => { throw e; });
    
                        pc.onicecandidate = (event) => {
                            // send event.candidate to peer
                            console.log('onicecandidate', event);
                        };
    
                    }
    
                    render() {
                        return (
                            <RTCView streamURL={this.state.videoURL} style={styles.container} />
                        );
                    }
                }
                const styles = {
                    container: {
                        flex: 1,
                        backgroundColor: '#ccc',
                        borderWidth: 1,
                        borderColor: '#000'
                    }
                };
    
                export default App;
    

    为什么我总是在问题标题的第行出现错误?。

    <RTCView streamURL={this.state.videoURL} style={styles.container} />
    
    0 回复  |  直到 4 年前
        1
  •  0
  •   bechir    4 年前

    这是您忘记执行的常见问题 npx pod-install