2016-04-05 13 views
0

ReactネイティブiOSを使用してwebRTCからビデオチャットを作成します。そのために、iOS用のネイティブコードを作成しました。これは、カメラへのアクセスのために私を求めますが、その後、それは、ビデオの読み込みに失敗し、温暖化のメッセージをスローし、WebRTCでEAGLDrawableをバインドできませんでした。

Failed to bind EAGLDrawable: <CAEAGLLayer: 0x16d50e30> to GL_RENDERBUFFER 1 
Failed to make complete framebuffer object 8cd6 

私は警告の上知っているビデオフレームをレンダリングするためのカメラにビューを取得していないためです。しかし、私は私が間違って私は私が間違っている場所を知って興味フレームそれを与えるために失敗したコード、私のコードは以下の通りです、

import React, { 
    AppRegistry, 
    Component, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 

var WebRTC = require('react-native-webrtc'); 
var { 
    RTCPeerConnection, 
    RTCMediaStream, 
    RTCIceCandidate, 
    RTCSessionDescription, 
    RTCView 
} = WebRTC; 


var container; 
var configuration = {"iceServers": [{"url": "stun:stun.l.google.com:19302"}]}; 
    var pc = new RTCPeerConnection(configuration); 
    navigator.getUserMedia({ "audio": true, "video": true }, function (stream) { 
    pc.addStream(stream); 
    }); 
    pc.createOffer(function(desc) { 
    pc.setLocalDescription(desc, function() { 
    // Send pc.localDescription to peer 
    }, function(e) {}); 
    }, function(e) {}); 
    pc.onicecandidate = function (event) { 
    // send event.candidate to peer 
}; 

var RCTWebRTCDemo = React.createClass({ 
    getInitialState: function() { 
    return {videoURL: null}; 
    }, 
    componentDidMount: function() { 
    container = this; 
    }, 
    render: function() { 
    return (
     <View style={styles.container}> 
     <RTCView streamURL={this.state.videoURL}/> 
     </View> 
    ); 
    } 
}); 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
    instructions: { 
    textAlign: 'center', 
    color: '#333333', 
    marginBottom: 5, 
    }, 
}); 

AppRegistry.registerComponent('RCTWebRTCDemo',() => RCTWebRTCDemo); 

を反応させるのか分からないのですか?

+0

「ComponentDidMount()」で 'create pc'と' getUserMedia'を変更することがありますか? – zxcpoiu

+0

と誰かがレポに言ったように、RTCViewで高さと幅を設定しましたか? – zxcpoiu

+0

@zxcpoiuありがとう。私はその問題を解決した。右フレームがRTCViewに間違って設定されました。 – Tirth

答えて

2

私は

<View style={styles.container}> 
     <RTCView streamURL={this.state.videoURL}/> 
</View> 

前にフレームを設定するが、そのは間違っていました。 RTCViewの作成はわずかに異なりますので、フレームをRTCView構文内に設定します。正しい方法は、

 <View> 
     <RTCView streamURL={this.state.videoURL} style={styles.container}/> 
     </View> 
関連する問題