AgoraIO-Community / VideoUIKit-ReactNative

A React Native package to simply integrate Agora Video Calling or Live Video Streaming to your app with just a few lines of code.
MIT License
93 stars 43 forks source link

Other users cannot Join video stream with token gotten from agora-web-services such as Render & Railway. Only displaying a video screen. #119

Closed ghost closed 1 year ago

ghost commented 1 year ago

Target device: (Note: simulators are not supported for running the UIKit)

App Info

Describe the issue I have built this uikit and run it with the appId , desired_channel_name , app_certificate, token, gotten from the console together with the demo web_app using the same configurations and it successfully connected me to the video stream.

But when I create the token generating server with either render or railway to generate token for rtc or rtm , as I pass the value of channel used to generate the token and the token to test the videokit I got a video screen with just buttons. No user can join the stream;

To Reproduce Steps to reproduce the behavior:

  1. Follow these steps to create a token server (note: I use render.com in this case and the token generate successfully just as railway's)
  2. After that I copy the token generated and used it on both the app and the demo web_app with the appropriate channel when generating token.
  3. Got a video screen on the caller page and no user can join the video stream.
  4. Only getting this log errors when creating a call
    • You can use the cameras & mic
    • hello
    • hello2
    • UIkit enabling dual stream undefined
    • Login to RTM
    • login error [Error: LOGIN_ERR_INVALID_ARGUMENT]
    • join RTM channel AwulonMunro
    • joinChannelError: [Error: JOIN_CHANNEL_ERR_USER_NOT_LOGGED_IN]
    • sendMessage [Error: CHANNEL_MESSAGE_ERR_USER_NOT_LOGGED_IN]

App Component

import React, {useState} from 'react';
import AgoraUIKit from 'agora-rn-uikit';
import {Text} from 'react-native';

const App = () => {
    const [videoCall, setVideoCall] = useState(true);
    const connectionData = {
        appId: '<app-id>',
        channel: '<channel>',
        token: '<token>',
        uid: <uid>,
    };
const rtCallbacks = {
/*
* @callbacks
*/
}
 return videoCall ? (
        <AgoraUIKit connectionData={connectionData} rtcCallbacks={rtcCallbacks} />
    ) : (
        <Text onPress={() => setVideoCall(true)}>Start Call</Text>
    );

}

export default App;

P.S

@EkaanshArora please I will like a speedy reply on this. Thanks. Also note that when I use the token and channel name generated from the console it works but don't work for when generated from a server-token (e.g railway, render)

ghost commented 1 year ago

Okay after going through the documentation I came to discover that each user joining the video stream must have a unique id (uid) before call can connect.