Screen Sharing Issue

[harsh-wadhwa]

I have been trying to implement screen sharing and it is not working. I am passing enableScreensharing: true in rtcProps and there is the screensharing button in UI > clicking it asks for what to share in the chrome's submenu of sharing screen which asks tab or entire screen etc. But after that step, I don't see any screen shared on other person's side or on my side UI.

[EkaanshArora]

I am able to use screenshare fine on a fresh project using the latest version of the UIKit with Vite. Are you using tokens? Can you submit a simple reproduction?

[EkaanshArora]

If you're using the an AppID with certificate make sure you're using the correct tokens for the user and the screenshare. Example:

const rtcProps = {
    appId: "xxxxxxxxxxxxxxxx",
    channel: "test", // your agora channel
    enableScreensharing: true,
    uid: 10001,
    token: "xxxxxxxxxxxxxxxx",
    screenshareUid: 10002,
    screenshareToken: "xxxxxxxxxxxxxxxx"
  } as RtcPropsInterface;

[harsh-wadhwa]

I am not very much aware of how things work here in agora but this is how I did.

    setAgoraRtcProps({
        appId: process.env.REACT_APP_AGORA_APP_ID,          // I have backend setup with agora token generator 
        channel: bookedEventFinalData?.id,                       // I have this id too and i understand this
        token: response?.data,                                    // Getting from my server. it returns just one token, do i need more?
        uid: bookedEventFinalData?.asHost ? bookedEventFinalData?.mentorUserId : bookedEventFinalData?.userId,          // using user id as uid and server is making token using same.
        enableScreensharing: true,                   // I had done till this much, i was able to join video calls and talk to other person, and screen share was not working properly

        screenshareUid: bookedEventFinalData?.asHost ? bookedEventFinalData?.mentorUserId : bookedEventFinalData?.userId, // I added this after seeing your comment above @EkaanshArora, does it have to be same as uid ? I couldn't find this anywhere in doc, and still not working
        screenshareToken: response?.data, // I added this after seeing your comment above @EkaanshArora, is this token same as token above ? still not working 

        // activeSpeaker: true
        // role: sessionData?.asHost ? 'host' : 'audience',
    })
    setVideoCall(true);
}

UI :

                            <div style={{ display: "flex", width: "100%", height: "100%" }}>
                                <AgoraUIKit
                                    rtcProps={agoraRtcProps}
                                    callbacks={agoraCallbacks}
                                    styleProps={{
                                        localBtnContainer: { backgroundColor: '#78978e' }
                                    }}
                                    rtmProps={{
                                        username: username,
                                        displayUsername: true,
                                        // token: '<RTMTOKEN>', // haven't setup rtm yet. is this token same as rtc token
                                    }}
                                />
                            </div>) : <div>other ui to join </div> ```

[EkaanshArora]

userId and screenshareId both should be unique and the token for each will be based on the ID you use. Example: UserId: 10001 & screenshareId: 10002

[harsh-wadhwa]

Thanks @EkaanshArora I was able to share screen when using different id-token set for user and screen. I am closing this issue.