AgoraIO-Community / VideoUIKit-Web-React

A Web library to simply integrate Agora Video Calling or Live Video Streaming to your website with just a few lines of code.
MIT License
54 stars 46 forks source link

Unable to See Other person video #32

Closed Programmer-Mukesh closed 1 year ago

Programmer-Mukesh commented 1 year ago

I am using agora-react-ui-kit on the web and other user is joining from the flutter app. Agent from flutter app is able to see both the videos of his device, meanwhile I am only able to see my own video on web.

My VideoCall component looks like this-

import React, { useEffect, useState } from "react"; import AgoraUIKit, { layout, VideoRenderMode } from "agora-react-uikit"; import { useRouter } from "next/router"; import 'agora-react-uikit/dist/index.css'

const Videcall = () => { const [videocall, setVideocall] = useState(true); const [isHost, setHost] = useState(true); const [isPinned, setPinned] = useState(false); const [username, setUsername] = useState(""); const [RTCDetalis, setRtcDetails] = useState({});

useEffect(() => { setRtcDetails(JSON.parse(sessionStorage.getItem("RTCAgoraDetails"))); }, []);

const router = useRouter(); return (

{videocall ? ( <> { setVideocall(false); router.push("/"); }, }} /> ) : (

setVideocall(true)}> Start Call

)}

); };

const styles = { container: { width: "100vw", height: "92vh", display: "flex", flex: 1, backgroundColor: "#007bff22", }, videoContainer: { display: "flex", flexDirection: 'column', flex: 1 }, btn: { backgroundColor: "#007bff", cursor: "pointer", borderRadius: 5, padding: "4px 8px", color: "#ffffff", fontSize: 20, }, };

export default Videcall;

Programmer-Mukesh commented 1 year ago

Please help me with the same. Thanks in advance