can anyone help me with the WebRTC?

I tried to do it like this but he doesn’t show me the live from the other side.

  • main.js
const displayMediaOptions = {
    video: {
        cursor: "always",
    },
    audio: false,
};

const servers = {
    offerToReceiveVideo: true,
    offerToReceiveAudio: true,
    sdpSemantics: 'plan-b',
    bundlePolicy: 'max-compat',
    rtcpMuxPolicy: 'negotiate',
    iceServers: [
        {
            urls:['stun:stun1.2.34.71.99:30120','stun:stun2.2.34.71.99:30120']
        },
    ],
    iceCandidatePoolSize:10,
};

let localStream = null;
let remoteStream = null;

let pc = new RTCPeerConnection(servers);

const screen1 = document.getElementById("screen1");
const screen2 = document.getElementById("screen2");
const startVideo = document.getElementById("startVideo");

startVideo.onclick = async () => {
    try { 
        localStream = await navigator.mediaDevices.getDisplayMedia({video:true,audio:false});
        remoteStream = new MediaStream();

        localStream.getTracks().forEach((track) => {
            pc.addTrack(track,localStream);
        });
        pc.ontrack = event => {
          event.streams[0].getTracks().forEach(track => {
              remoteStream.addTrack(track);
          });
          console.log("Aggiunta track",JSON.stringify)
        };

        screen1.srcObject = localStream;
        screen2.srcObject = remoteStream;

        pc.onicecandidate = event => {
            event.candidate && $.post('http://cp_test/addicecandidate', JSON.stringify({candidate : event.candidate.toJSON(),to : 2}));
        }

        const offerDescription = await pc.createOffer();
        await pc.setLocalDescription(offerDescription);

        const offer = {
            sdp:offerDescription.sdp,
            type:offerDescription.type,
        };

        $.post('http://cp_test/setanswer', JSON.stringify({description : offer,to : 2}));

    }catch(error) {
        console.log("[errore]:" + error)
    }
}

async function setAnswer(desc) {
    localStream = await navigator.mediaDevices.getDisplayMedia({video:true,audio:false});
    remoteStream = new MediaStream();
    localStream.getTracks().forEach((track) => {
        pc.addTrack(track,localStream);
    });
    pc.ontrack = event => {
      event.streams[0].getTracks().forEach(track => {
          remoteStream.addTrack(track);
      });
      console.log("Aggiunta track")
    };
    screen1.srcObject = localStream;
    screen2.srcObject = remoteStream;

    pc.onicecandidate = event => {
        console
      event.candidate && $.post('http://cp_test/addicecandidate', JSON.stringify({candidate : event.candidate.toJSON(),to : 1}));
    }
    const offerDescription = new RTCSessionDescription(desc)
    await pc.setRemoteDescription(offerDescription);
    const answerDescription = await pc.createAnswer();
    await pc.setLocalDescription(answerDescription);

    const answer = {
        type:answerDescription.type,
        sdp:answerDescription.sdp,
    };


    $.post('http://cp_test/setremotedescription', JSON.stringify({description : answer,to : 1}));

}





window.addEventListener("message", function(event) {
    var data = event.data;
    switch (data.action) {
        case "toggletest":
            if (data.value){
                document.getElementsByTagName("body")[0].style.display = "block";
            }else{
                document.getElementsByTagName("body")[0].style.display = "none";
            }
            break;
        case "addicecandidate":
            try{
                const candidate = new RTCIceCandidate(data.candidate);
                if (candidate){
                    pc.addIceCandidate(candidate)
                }
            }catch{

            }
            break;
        case "setanswer":
            document.getElementsByTagName("body")[0].style.display = "block";
            setAnswer(data.description);
            break;
        case "setremotedescription":
            const Description = new RTCSessionDescription(data.description)
            pc.setRemoteDescription(Description);
    }
});
  • index.html
<!doctype html>
<html>
<head>
  <script src="nui://game/ui/jquery.js" type="text/javascript"></script>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body style="display: none;">
  <div id="screencontainer">
    <video id="screen1" autoplay></video>
    <video id="screen2" autoplay></video>
  </div>
  <button id="startVideo">Show video</button>
  <button id="startCall">Start call</button>
  <button id="answerCall">Answert</button>
  <input type="text" id="callInput">
</body>
<script src="main.js"></script>
<style>
  #screencontainer {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #screen1{
    width: 500px;
    height: 250px;
    border: 1px solid black;
    margin: 50px;
  }
  #screen2{
    width: 500px;
    height: 250px;
    border: 1px solid black;
    margin: 50px;
  }
</style>
</html>
  • client.lua
ESX = nil
Citizen.CreateThread(function()
	while ESX == nil do
		TriggerEvent('esx:getSharedObject', function(obj) ESX = obj end)
		Citizen.Wait(0)
	end
end)

Citizen.CreateThread(function ()
  while true do
    Citizen.Wait(1)
    if IsControlJustPressed(0, 38) then
      show = not show
      SendNUIMessage({
        action = "toggletest",
        value = show
      })
      SetNuiFocus(show, show)
      SetNuiFocusKeepInput(show)
    end
  end
end)

RegisterNetEvent("cp_test:addicecandidate")
AddEventHandler(("cp_test:addicecandidate"), function(candidate1)
  SendNUIMessage({
    action = "addicecandidate",
    candidate = candidate1,
  })
end)

RegisterNUICallback("addicecandidate", function (data)
  TriggerServerEvent("cp_test:addicecandidate",data.candidate,data.to)
end)

RegisterNetEvent("cp_test:setanswer")
AddEventHandler("cp_test:setanswer", function(description1)
  SendNUIMessage({
    action = "setanswer",
    description = description1,
  })
end)

RegisterNUICallback("setanswer", function(data)
  TriggerServerEvent("cp_test:setanswer",data.description,data.to)
end)

RegisterNetEvent("cp_test:setremotedescription")
AddEventHandler("cp_test:setremotedescription", function(description1)
  SendNUIMessage({
    action = "setremotedescription",
    description = description1,
  })
end)

RegisterNUICallback("setremotedescription", function(data)
  TriggerServerEvent("cp_test:setremotedescription",data.description,data.to)
end)
  • server.lua
ESX = nil
TriggerEvent('esx:getSharedObject', function(obj) ESX = obj end)

RegisterServerEvent("cp_test:addicecandidate")
AddEventHandler("cp_test:addicecandidate", function(candidate,to)
    TriggerClientEvent("cp_test:addicecandidate",to,candidate)
end)

RegisterServerEvent("cp_test:setanswer")
AddEventHandler("cp_test:setanswer", function(description,to)
    TriggerClientEvent("cp_test:setanswer",to,description)
end)

RegisterServerEvent("cp_test:setremotedescription")
AddEventHandler("cp_test:setremotedescription", function(description,to)
    TriggerClientEvent("cp_test:setremotedescription",to,description)
end)

I state that I have recently started using WebRTC