{"id":386901,"date":"2024-06-29T06:59:33","date_gmt":"2024-06-29T06:59:33","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=386901"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=386901","title":{"rendered":"\u0423\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c \u0440\u043e\u0431\u043e\u0442\u0430\u043c\u0438 \u0438\u0437 VR. \u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0435\u043d\u0438\u0435 1<\/span>"},"content":{"rendered":"
<\/div>\n
\n
\n
\n
\n

\u041f\u0435\u0440\u0432\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f \u2013 \u0423\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c \u0440\u043e\u0431\u043e\u0442\u0430\u043c\u0438 \u0438\u0437 VR<\/a><\/p>\n

\u0412 \u043f\u0440\u043e\u0448\u043b\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435, \u043c\u044b \u043f\u0440\u043e\u0432\u0435\u043b\u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u0443\u044e \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0443 \u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043b\u0438 \u0441\u0438\u0433\u043d\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u0434\u043b\u044f \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430\u043c\u0438 websocket. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u043c\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u0443 \u043f\u043e WebRTC (\u0427\u0430\u0441\u0442\u0438 3, 4).<\/p>\n

\u0427\u0430\u0441\u0442\u044c 3. \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 WebRTC Connection + DataChannel <\/h2>\n

\u0418\u0442\u0430\u043a, \u0443 \u043d\u0430\u0441 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d \u0441\u0435\u0440\u0432\u0435\u0440 \u0441\u0438\u0433\u043d\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u044b \u0441\u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u043e\u0431\u043c\u0435\u043d\u0430 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c WebRTC — offer, answer, ice, \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043f\u0440\u043e webrtc \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 \u0442\u0443\u0442<\/a>, \u043d\u0435 \u0431\u0443\u0434\u0435\u043c \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u0434\u0435\u0442\u0430\u043b\u044f\u0445.<\/p>\n

\u0412 \u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u044e WebRTC \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f, \u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 DataChannel \u043c\u0435\u0436\u0434\u0443 2\u043c\u044f \u043f\u0438\u0440\u0430\u043c\u0438 \u0432 JS-Python-C#.<\/p>\n

\u0421\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442<\/h3>\n

\u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u0443\u044e \u0440\u0430\u043d\u0435\u0435 \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0443 main.html \u043d\u043e\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b:<\/p>\n

\nmain.html<\/summary>\n
\n
...   <div class=\"row-md-6\">     <form class=\"form-inline\">       <div class=\"form-group\">         <label for=\"content\">Send offer to:<\/label>         <input type=\"text\" id=\"offerTo\" class=\"form-control\" placeholder=\"Offer to...\">       <\/div>       <button id=\"createOffer\" class=\"btn btn-primary\" type=\"submit\">Create Offer<\/button>     <\/form>   <\/div>   <div class=\"row-md-6\">     <form class=\"form-inline\">       <div class=\"form-group\">         <label for=\"content\">Message directly:<\/label>         <input type=\"text\" id=\"content2\" class=\"form-control\" placeholder=\"Message here...\">       <\/div>       <button id=\"sendMessageDirectly\" class=\"btn btn-primary\" type=\"submit\">Directly message<\/button>     <\/form>   <\/div> ...<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
\u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 datachannel \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0434\u043e\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u043d\u0430\u0448 \u0441\u043a\u0440\u0438\u043f\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u2013 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043e\u0431\u043c\u0435\u043d\u0430 sdp\/ice \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0438 \u043f\u0440\u0438\u0435\u043c\u0430 OFFER. \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 DataCh\u0430annel \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0443 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439 \u043c\u0435\u0436\u0434\u0443 \u043f\u0438\u0440\u0430\u043c\u0438:<\/p>\n
\nrobo.js<\/summary>\n
\n
var connection; var userId = 'unknown'; var peerConnection; var dataChannel; var configuration = {   \"iceServers\" : [{   \"urls\" : \"stun:stun2.1.google.com:19302\"   }] };  function connect(){   connection = new WebSocket('wss:\/\/' + window.location.host + '\/robopi_webrtc');   console.log(\"Connsection sucsess\");      initRTCPeerConnection();      connection.onmessage = function(msg) {          var resp = JSON.parse(msg.data);            if(resp.type == 'USERID'){       console.log();       userId = resp.data;       document.getElementById(\"username\").textContent = userId;     }     if(resp.type == 'NEWMEMBER'){       if(userId != resp.userId){         console.log(\"NEWMEMDER:\" + resp.userId);       }     }     if(resp.type == 'OFFER'){       if(userId != resp.userId){         console.log(resp);         handleOffer(resp.payload, resp.userId)       }     }     if(resp.type == 'ICE'){       if(userId != resp.userId){         console.log(resp);         receiveIceCandidate(resp.payload);       }     }     if(resp.type == 'ANSWER'){       if(userId != resp.userId){         console.log(resp);         handleAnswer(resp.payload);       }     }   } }  function login() {   connection.send(JSON.stringify({'userId' : '', 'type' : 'LOGIN', 'data' : '' , 'toUserId' : ''})); }  function newmember() {   connection.send(JSON.stringify({'userId' : userId, 'type' : 'NEWMEMBER', 'data' : '' , 'toUserId' : ''})); }  function initRTCPeerConnection(){   peerConnection = new RTCPeerConnection(configuration);   console.log(\"peerConnection created\");   \/\/ remote datachannel handler   peerConnection.ondatachannel = function(event){     dataChannel = event.channel;     \/\/ open handling     dataChannel.onopen = function(){     console.log(\"Data channel is open!\");     }     \/\/ error handling     dataChannel.onerror = function(error){       console.log(\"Error in datachannel:\", error);     };     \/\/ messaging handler     dataChannel.onmessage = function(event) {       console.log(\"incoming message:\", event.data);     };     \/\/ closing handler     dataChannel.onclose = function() {       console.log(\"Data channel is closed\");     };   }; }  function createRTCDatachannel(){   dataChannel = peerConnection.createDataChannel(\"datachannel\", {      reliable: true    });   \/\/ open handling   dataChannel.onopen = function(){     console.log(\"Data channel is open!\");   }   \/\/ error handling   dataChannel.onerror = function(error){     console.log(\"Error in datachannel:\", error);   };   \/\/ messaging handler   dataChannel.onmessage = function(event) {     console.log(\"incoming message:\", event.data);   };   \/\/ closing handler   dataChannel.onclose = function() {     console.log(\"Data channel is closed\");   }; }  function createOffer(){   createRTCDatachannel();   peerConnection.createOffer(function(offer) {     connection.send(JSON.stringify({'userId' : userId, 'type' : 'OFFER', 'payload' : offer , 'toUserId' : $(\"#offerTo\").val()}));     peerConnection.setLocalDescription(offer);   },   function(error) {     console.log(\"error in offer creating:\" + error);   });   sendIceCandidate(); }  function sendIceCandidate(){   peerConnection.onicecandidate = function(event) {   if (event.candidate) {     console.log(\"sending ice candidate:\" + event.candidate);     connection.send(JSON.stringify({'userId' : userId, 'type' : 'ICE', 'payload' : event.candidate , 'toUserId' : $(\"#offerTo\").val()}));   }   }; }  function receiveIceCandidate(candidate){   peerConnection.addIceCandidate(new RTCIceCandidate(candidate));   console.log(\"sucsess receiving ice candidate\"); }  function handleAnswer(answer){   peerConnection.setRemoteDescription(new RTCSessionDescription(answer));   console.log(\"handling amswer successfully!!\"); }  function handleOffer(offer, fromUser) {   peerConnection.setRemoteDescription(new RTCSessionDescription(offer));   \/\/ create and send an answer to an offer   peerConnection.createAnswer(function(answer) {     peerConnection.setLocalDescription(answer);     connection.send(JSON.stringify({'userId' : userId, 'type' : 'ANSWER', 'payload' : answer , 'toUserId' : fromUser}));   }, function(error) {     console.log(\"error creating answer:\" + error);   }); };  function sendMessageDirectly(){   var message = $(\"#content2\").val();   dataChannel.send(message);   console.log(\"send message:\" + message); }  $(function () {   $(\"form\").on('submit', function (e) {   e.preventDefault();   });    $( \"#connect\" ).click(function() { connect(); }); $( \"#login\" ).click(function() { login(); }); $( \"#newmember\" ).click(function() { newmember(); }); $( \"#createOffer\" ).click(function() { createOffer(); }); $( \"#sendMessageDirectly\" ).click(function() { sendMessageDirectly(); }); });<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
\u0414\u0435\u043b\u0430\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u043c\u0435\u0436\u0434\u0443 2\u043c\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u043c\u0438, \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c, \u0443 \u043d\u0430\u0441 \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c\u0441\u044f datachannel \u0438 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u043c\u0438:<\/p>\n
\n\u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430:<\/summary>\n
\n
<\/figure>\n
<\/figure>\n<\/p>\n<\/div>\n<\/details>\n
\u0418\u0441\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442(Python-\u0441\u043a\u0440\u0438\u043f\u0442 \u043d\u0430 RPI)<\/h3>\n
\u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441  WebRTC \u0438\u0437 \u043f\u0430\u0439\u0442\u043e\u043d \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0438\u0431\u0438\u043b\u0438\u043e\u0442\u0435\u043a\u0443 aiortc:<\/p>\n
 pip3 install aiortc<\/code><\/p>\n
\u0422\u0443\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u044e\u0442 \u043f\u0435\u0440\u0432\u044b\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u044c\u044e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0439 WebRTC (ICE) \u0438 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u043c \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u2013 Python \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0438\u043d\u0438\u0446\u0438\u0430\u0442\u043e\u0440\u043e\u043c \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f, \u0442.\u00a0\u0435. \u043e\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0432\u0445\u043e\u0434\u044f\u0449\u0438\u0435 \u043e\u0444\u0444\u0435\u0440\u044b:<\/p>\n
\npart2.py<\/summary>\n
\n
import asyncio import websockets import json import ssl from websockets import WebSocketClientProtocol from aiortc import RTCIceCandidate, RTCPeerConnection, RTCSessionDescription, RTCConfiguration, RTCIceServer  async def wsconsume(wsurl: str) -> None:     ssl_context = ssl.SSLContext()     async with websockets.connect(wsurl, ssl=ssl_context) as websocket:         await websocket.send(json.dumps({\"userId\": \"\", \"type\": \"LOGIN\", \"data\": \"\", \"payload\": \"\", \"toUserId\": \"\"}))         await wsconsumer_handler(websocket)   async def wsconsumer_handler(websocket: WebSocketClientProtocol) -> None:     local_user_id = \"\"     ice_servers = [RTCIceServer(urls=[\"stun:stun2.l.google.com:19302\"])]     peer_conn = RTCPeerConnection(RTCConfiguration(iceServers=ice_servers))          @peer_conn.on(\"connectionstatechange\")     async def on_connectionstatechange():         print(\"Connection state is %s\" % peer_conn.connectionState)         if peer_conn.connectionState == \"failed\":             await peer_conn.close()      @peer_conn.on(\"signalingstatechange\")     async def on_signalingstatechange():         print(f\"changed signalingstatechange {peer_conn.signalingState}\")      @peer_conn.on(\"icegatheringstatechange\")     async def on_icegatheringstatechange():         print(f\"changed icegatheringstatechange {peer_conn.iceGatheringState}\")              @peer_conn.on(\"datachannel\")     async def on_datachannel(channel):         print(f\"changed datachannel to {channel}\")         @channel.on(\"message\")         async def on_message(rtc_message):             if isinstance(rtc_message, str):                 print(\"New message from datachannel \" + rtc_message)                 channel.send(\"Reply from PyPi - \" + rtc_message)          async for message in websocket:          msg = json.loads(message)          if msg.get(\"type\") == 'USERID' and local_user_id != msg.get(\"userId\"):             local_user_id = msg.get(\"data\")             print(\"SET UID: \" + local_user_id)             await websocket.send(json.dumps({\"userId\": local_user_id, \"type\": \"NEWMEMBER\", \"data\": \"\",                                              \"payload\": \"\", \"toUserId\": \"\"}))          if msg.get(\"type\") == 'OFFER' and local_user_id == msg.get(\"toUserId\"):             print(\"Handling offer: \" + str(msg.get(\"payload\")))                          await peer_conn.setRemoteDescription(                 RTCSessionDescription(sdp=msg.get(\"payload\").get(\"sdp\"), type=msg.get(\"payload\").get(\"type\")))                           answer = await peer_conn.createAnswer()             print(\"Creating answer:\" + str(answer))             await peer_conn.setLocalDescription(answer)              await websocket.send(json.dumps({\"userId\": local_user_id, \"type\": \"ANSWER\", \"data\": \"\",                                              \"payload\": {\"sdp\": answer.sdp, \"type\": answer.type},                                              \"toUserId\": msg.get(\"userId\")}))                      if msg.get(\"type\") == 'ICE' and local_user_id == msg.get(\"toUserId\"):             print(\"ICE INCOMING\")             candidate = msg.get(\"payload\").get(\"candidate\").split()             new_ice = RTCIceCandidate(                 component=int(candidate[1]),                 foundation=candidate[0].split(\":\")[1],                 ip=candidate[4],                 port=int(candidate[5]),                 priority=int(candidate[3]),                 protocol=candidate[2],                 type=candidate[7],                 relatedAddress=None,                 relatedPort=None,                 sdpMid=msg.get(\"payload\").get(\"sdpMid\"),                 sdpMLineIndex=int(msg.get(\"payload\").get(\"sdpMLineIndex\")),                 tcpType=None             )             await peer_conn.addIceCandidate(new_ice)          if msg.get(\"type\") == 'ANSWER' and local_user_id == msg.get(\"toUserId\"):             print(\"ANSWER INCOMING\")             await peer_conn.setRemoteDescription(                 RTCSessionDescription(sdp=msg.get(\"payload\").get(\"sdp\"), type=msg.get(\"payload\").get(\"type\")))  async def main():     task = asyncio.create_task(wsconsume('wss:\/\/192.168.10.146:9000\/robopi_webrtc'))     await task   if __name__ == '__main__':     loop = asyncio.get_event_loop()     try:         loop.run_until_complete(main())     except KeyboardInterrupt:         loop.stop()         pass<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
\u0414\u0435\u043b\u0430\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u0438 \u043f\u0430\u0439\u0442\u043e\u043d \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u043c, \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c, \u0443 \u043d\u0430\u0441 \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c\u0441\u044f datachannel \u0438 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u0438 python \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u043c:<\/p>\n
\n\u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430:<\/summary>\n
\n
<\/figure>\n
<\/figure>\n<\/p>\n<\/div>\n<\/details>\n
\u0423\u043f\u0440\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442(Unity VR)<\/h3>\n
\u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 WebRTC unity \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 WebRTC for Unity<\/a><\/p>\n
\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0435\u0435 \u043f\u043e \u0438\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438, \u0442\u0430\u043c \u0436\u0435 \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u044b \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0440\u0435\u0444\u0435\u0440\u0435\u043d\u0441\u044b \u043f\u043e \u0440\u0430\u0431\u043e\u0442\u0435(\u0447\u0430c\u0442\u044c \u043d\u0435 \u0441\u043e\u0432\u0441\u0435\u043c \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u0430, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0443\u0436\u043d\u043e \u0432\u043d\u0438\u043c\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043d\u0430 \u0441\u044d\u043c\u043f\u043b\u044b \u043a \u043f\u0430\u043a\u0435\u0442\u0443!)<\/p>\n
\n\u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435:<\/summary>\n
\n
<\/figure>\n<\/p>\n<\/div>\n<\/details>\n
C\u043a\u0440\u0438\u043f\u0442\u044b \u0438\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0438 Unity \u043c\u043e\u0433\u0443\u0442 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0438 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c offer \u0432 \u043e\u0431\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u0442.\u0435. \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0438\u043d\u0438\u0446\u0438\u0430\u0442\u043e\u0440\u0430\u043c\u0438 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f, \u0441\u043a\u0440\u0438\u043f\u0442 \u0438\u0437 Python \u043c\u043e\u0436\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u0432\u0445\u043e\u0434\u044f\u0449\u0438\u0439 offer \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0441\u0442\u0440\u0435\u0447\u043d\u044b\u0439 offer \u043f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430, \u043d\u043e \u0438\u043d\u0438\u0446\u0438\u0430\u0442\u043e\u0440\u043e\u043c \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f \u043e\u043d \u043d\u0435 \u0431\u0443\u0434\u0435\u0442.<\/p>\n
\n\u0414\u043e\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043d\u0430\u0448 UI \u0432 Unity \u043d\u043e\u0432\u044b\u043c\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438:<\/summary>\n
\n
<\/figure>\n
Dropdown<\/strong> \u2013 \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f Member.<\/p>\n
Create Offer<\/strong> \u2013 \u0434\u043b\u044f \u0438\u043d\u0438\u0446\u0438\u0430\u0446\u0438\u0438 WebRTC call.<\/p>\n
Send Hello<\/strong> \u2013 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f, \u043f\u043e \u043d\u0430\u0436\u0430\u0442\u0438\u044e \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u0432 datachannel \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0442\u0438\u043f\u043e\u0432\u043e\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u0441 \u0434\u0430\u0442\u043e\u0439\/\u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c. \u0414\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439 \u0438\u0437 datachannel \u0431\u0443\u0434\u0435\u043c \u043f\u0438\u0441\u0430\u0442\u044c \u0438\u0445 \u043f\u0440\u043e\u0441\u0442\u043e \u0432 debug log Unity.<\/p>\n<\/div>\n<\/details>\n
\u0414\u043e\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u043d\u0430\u0448 \u0441\u043a\u0440\u0438\u043f\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n
\nConnection.cs<\/summary>\n
\n
using System; using System.Collections; using System.Collections.Concurrent; using System.Collections.Generic; using Unity.WebRTC; using UnityEngine; using UnityEngine.UI; using WebSocketSharp;  public class Connection : MonoBehaviour {      private GameObject uuid;     private WebSocket ws;     private ConcurrentQueue<string> incomingWebsocketMessages;     private string userId = \"unknown\";      private GameObject wscandidates;     private List<string> dropOptions;      private RTCPeerConnection webrtcConnection;     private RTCDataChannel dataChannel, remoteDataChannel;      private DelegateOnDataChannel onDataChannel;     private DelegateOnOpen onDataChannelOpen;     private DelegateOnMessage onDataChannelMessage;     private DelegateOnClose onDataChannelClose;     private DelegateOnIceConnectionChange onIceConnectionChange;     private DelegateOnIceCandidate onIceCandidate;      void Start()     {         uuid = GameObject.FindGameObjectWithTag(\"uuid\");         incomingWebsocketMessages = new ConcurrentQueue<string>();          ws = new WebSocket(\"wss:\/\/192.168.10.146:9000\/robopi_webrtc\");         ws.SslConfiguration.EnabledSslProtocols = System.Security.Authentication.SslProtocols.Tls12;          ws.OnOpen += (sender, e) =>         {             Debug.Log(\"OPEN WEBSOCKET\");         };          ws.OnMessage += (sender, e) =>         {             if (e.IsText)             {                 incomingWebsocketMessages.Enqueue(e.Data);                 Debug.Log(\"Incoming websocket message:\" + e.Data);             }         };          ws.OnClose += (sender, e) => {             Debug.Log(\"CLOSE WEBSOCKET:\" + e.Reason);         };          dropOptions = new List<string> { \"No candidates!\" };         wscandidates = GameObject.FindGameObjectWithTag(\"candidates\");         wscandidates.GetComponent<Dropdown>().AddOptions(dropOptions);          webrtcConnection = new RTCPeerConnection();          onDataChannelOpen = () =>         {             Debug.Log(\"OPEN LOCAL DATACHANNEL\");             var welcome = \"Welcome to Unity WebRTC! Local creation!\";             dataChannel.Send(welcome);             dataChannel.OnMessage = onDataChannelMessage;         };          onDataChannel = channel =>         {             remoteDataChannel = channel;             Debug.Log(\"OPEN REMOTE DATACHANNEL\");             var welcome = \"Welcome to Unity WebRTC! Remote creation!\";             remoteDataChannel.Send(welcome);             remoteDataChannel.OnMessage = onDataChannelMessage;         };          onDataChannelMessage = bytes =>         {             var messageText = System.Text.Encoding.UTF8.GetString(bytes);             Debug.Log(\"Incoming datachannel message: \" + messageText);         };          onDataChannelClose = () =>         {             Debug.Log(\"CLOSE DATACHANNEL\");         };          onIceConnectionChange = state => {             OnIceConnectionChange(webrtcConnection, state);         };          onIceCandidate = candidate => {             OnIceCandidate(webrtcConnection, candidate);         };      }      void Update()     {         if (incomingWebsocketMessages.TryDequeue(out var wsmessage))         {             var answer = JsonUtility.FromJson<WSMessage<string>>(wsmessage);              if (answer.type.Equals(\"USERID\") && !answer.data.Equals(userId))             {                 userId = answer.data;                 SetUserId(userId);             }             else if (answer.type.Equals(\"NEWMEMBER\") && !answer.userId.Equals(userId))             {                 string newcandidate = answer.userId;                 AddNewWsCandidate(newcandidate);             }             else if (answer.type.Equals(\"OFFER\") && !answer.userId.Equals(userId))             {                 var incomingOffer = JsonUtility.FromJson<WSMessage<Offer>>(wsmessage);                 Debug.Log(\"INCOMING OFFER:\" + incomingOffer);                  var desc = new RTCSessionDescription();                 desc.type = RTCSdpType.Offer;                 desc.sdp = incomingOffer.payload.sdp;                  wscandidates.GetComponent<Dropdown>().captionText.text = answer.userId;                  StartCoroutine(HandleCall(desc));             }             else if (answer.type.Equals(\"ICE\") && !answer.userId.Equals(userId))             {                 var iceCandidate = JsonUtility.FromJson<WSMessage<Ice>>(wsmessage);                  Debug.Log(\"INCOMING ICE:\" + answer);                  RTCIceCandidateInit init = new RTCIceCandidateInit();                 init.candidate = iceCandidate.payload.candidate;                 init.sdpMid = iceCandidate.payload.sdpMid;                 init.sdpMLineIndex = iceCandidate.payload.sdpMLineIndex;                  RemoteIceCandidate(webrtcConnection, new RTCIceCandidate(init));             }             else if (answer.type.Equals(\"ANSWER\") && !answer.userId.Equals(userId))             {                 var incomingAnswer = JsonUtility.FromJson<WSMessage<Answer>>(wsmessage);                 Debug.Log(\"INCOMING ANSWER:\" + incomingAnswer.payload.type + \"  sdp:\" + incomingAnswer.payload.sdp);                  var desc = new RTCSessionDescription();                 desc.type = RTCSdpType.Answer;                 desc.sdp = incomingAnswer.payload.sdp;                  StartCoroutine(ConsumeAnswer(desc));             }         }     }     public void AddNewWsCandidate(string candidate)     {         dropOptions.Add(candidate);         wscandidates.GetComponent<Dropdown>().ClearOptions();         wscandidates.GetComponent<Dropdown>().AddOptions(dropOptions);         wscandidates.GetComponent<Dropdown>().RefreshShownValue();     }      IEnumerator HandleCall(RTCSessionDescription desc)     {          webrtcConnection.OnIceCandidate = onIceCandidate;         webrtcConnection.OnIceConnectionChange = onIceConnectionChange;         webrtcConnection.OnDataChannel = onDataChannel;          var op = webrtcConnection.SetRemoteDescription(ref desc);         yield return op;          if (!op.IsError)         {             Debug.Log(\"Set Remote Description complete\");         }         else         {             var error = op.Error;             Debug.Log(\"ERROR Set Session Description: \" + error);         }          var op2 = webrtcConnection.CreateAnswer();         yield return op2;         if (!op2.IsError)         {             string remoteUuid = wscandidates.GetComponent<Dropdown>().captionText.text;              var wsAnswer = new WSMessage<Answer>             {                 userId = userId,                 type = \"ANSWER\",                 data = \"\",                 payload = new Answer(op2.Desc.sdp, \"answer\"),                 toUserId = remoteUuid             };              Debug.Log(\"CREATE ANSWER:\" + JsonUtility.ToJson(wsAnswer));              ws.Send(JsonUtility.ToJson(wsAnswer));              Debug.Log(\"SEND ANSWER:\" + JsonUtility.ToJson(wsAnswer));              yield return OnCreateAnswerSuccess(op2.Desc);         }         else         {             Debug.Log(\"ERROR Create Session Description:\" + op2.Error.message);         }      }      IEnumerator OnCreateAnswerSuccess(RTCSessionDescription desc)     {         var op = webrtcConnection.SetLocalDescription(ref desc);         yield return op;          if (!op.IsError)         {             Debug.Log(\"Set Local Description complete\");         }         else         {             var error = op.Error;             Debug.Log(\"ERROR Set Session Description: \" + error.message);         }     }      IEnumerator ConsumeAnswer(RTCSessionDescription desc)     {          var op = webrtcConnection.SetRemoteDescription(ref desc);         yield return op;          if (!op.IsError)         {             Debug.Log(\"Set Remote Description complete\");         }         else         {             var error = op.Error;             Debug.Log(\"ERROR Set Session Description: \" + error.message);         }      }      public void CallWebRTC()     {         StartCoroutine(Call());     }      IEnumerator Call()     {         webrtcConnection.OnIceCandidate = onIceCandidate;         webrtcConnection.OnIceConnectionChange = onIceConnectionChange;          var option = new RTCDataChannelInit();         dataChannel = webrtcConnection.CreateDataChannel(\"datachannel\", option);         dataChannel.OnOpen = onDataChannelOpen;         dataChannel.OnClose = onDataChannelClose;         webrtcConnection.OnDataChannel = onDataChannel;          var op = webrtcConnection.CreateOffer();         yield return op;          if (!op.IsError)         {              string remoteUuid = wscandidates.GetComponent<Dropdown>().captionText.text;              var wsOffer = new WSMessage<Offer>             {                 userId = userId,                 type = \"OFFER\",                 data = \"\",                 payload = new Offer(op.Desc.sdp, \"offer\"),                 toUserId = remoteUuid             };              Debug.Log(\"CREATE OFFER:\" + JsonUtility.ToJson(wsOffer));              ws.Send(JsonUtility.ToJson(wsOffer));              Debug.Log(\"SEND OFFER:\" + JsonUtility.ToJson(wsOffer));              yield return StartCoroutine(OnCreateOfferSuccess(op.Desc));         }         else         {             Debug.Log(\"ERROR Create Session Description: \" + op.Error);         }      }      IEnumerator OnCreateOfferSuccess(RTCSessionDescription desc)     {         var op = webrtcConnection.SetLocalDescription(ref desc);         yield return op;          if (!op.IsError)         {             Debug.Log(\"Set Local Description complete\");         }         else         {             var error = op.Error;             Debug.Log(\"ERROR Set Session Description: \" + error);         }      }      public void SendDirectMessage()     {         var message = \"Message from Unity \" + DateTime.Now;         if (dataChannel != null && dataChannel.ReadyState == RTCDataChannelState.Open) dataChannel.Send(message);         if (remoteDataChannel != null && remoteDataChannel.ReadyState == RTCDataChannelState.Open) remoteDataChannel.Send(message);     }      void OnIceConnectionChange(RTCPeerConnection pc, RTCIceConnectionState state)     {         switch (state)         {             case RTCIceConnectionState.New:                 Debug.Log(\"IceConnectionState: New\");                 break;             case RTCIceConnectionState.Checking:                 Debug.Log(\"IceConnectionState: Checking\");                 break;             case RTCIceConnectionState.Closed:                 Debug.Log(\"IceConnectionState: Closed\");                 break;             case RTCIceConnectionState.Completed:                 Debug.Log(\"IceConnectionState: Completed\");                 break;             case RTCIceConnectionState.Connected:                 Debug.Log(\"IceConnectionState: Connected\");                 break;             case RTCIceConnectionState.Disconnected:                 Debug.Log(\"IceConnectionState: Disconnected\");                 break;             case RTCIceConnectionState.Failed:                 Debug.Log(\"IceConnectionState: Failed\");                 break;             case RTCIceConnectionState.Max:                 Debug.Log(\"IceConnectionState: New\");                 break;             default:                 break;         }     }      void OnIceCandidate(RTCPeerConnection webrtcConnection, RTCIceCandidate candidate)     {         webrtcConnection.AddIceCandidate(candidate);         Debug.Log(\"ADDED local ICE candidate:\" + candidate.Candidate);         string remoteUuid = wscandidates.GetComponent<Dropdown>().captionText.text;         var iceCand = new WSMessage<Ice>         {             userId = userId,             type = \"ICE\",             data = \"\",             payload = new Ice(candidate.Candidate, (int)candidate.SdpMLineIndex, candidate.SdpMid, candidate.UserNameFragment),             toUserId = remoteUuid         };         ws.Send(JsonUtility.ToJson(iceCand));         Debug.Log(\"SEND ICE:\" + JsonUtility.ToJson(iceCand));     }      void RemoteIceCandidate(RTCPeerConnection webrtcConnection, RTCIceCandidate candidate)     {         webrtcConnection.AddIceCandidate(candidate);         Debug.Log(\"ADDED remote ICE candidate:\" + candidate.Candidate);     }      public void ConnectWebsocket()     {         ws.Connect();     }      public void DisconnectWebsocket()     {         ws.Close();     }      public void LoginWebsocket()     {         var hello = new WSMessage<string>         {             userId = \"\",             type = \"LOGIN\",             data = \"\",             payload = \"\",             toUserId = \"\"         };         ws.Send(JsonUtility.ToJson(hello));     }      public void SendNewmember()     {         var newmember = new WSMessage<string>         {             userId = userId,             type = \"NEWMEMBER\",             data = \"\",             payload = \"\",             toUserId = \"\"         };          ws.Send(JsonUtility.ToJson(newmember));     }      void SetUserId(string userId)     {         uuid.GetComponent<UnityEngine.UI.Text>().text = userId;     }  }  [Serializable] public class WSMessage<T> {     public string userId;     public string type;     public string data;     public T payload;     public string toUserId; }  [Serializable] public class Offer {     public string type;     public string sdp;      public Offer(string sdp, string type)     {         this.type = type;         this.sdp = sdp;     } }  [Serializable] public class Answer {     public string type;     public string sdp;     public Answer(string sdp, string type)     {         this.type = type;         this.sdp = sdp;     } }  [Serializable] public class Ice {     public string candidate;     public int sdpMLineIndex;     public string sdpMid;     public string usernameFragment;      public Ice(string candidate, int sdpMLineIndex, string sdpMid, string usernameFragment)     {         this.candidate = candidate;         this.sdpMLineIndex = sdpMLineIndex;         this.sdpMid = sdpMid;         this.usernameFragment = usernameFragment;     } }<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043d\u0430\u0448\u0438 \u043c\u0435\u0442\u043e\u0434\u044b SendDirectMessage \u0438 CallWebRTC \u043d\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0435 Button \u0438 \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u0438\u0441\u0442\u0443\u043f\u0438\u0442\u044c \u043a \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0435.<\/p>\n
\u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 <\/h4>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0441\u0442\u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u0438 Unity \u0441 \u0434\u0432\u0443\u0445 \u0441\u0442\u043e\u0440\u043e\u043d \u0438 \u043c\u0435\u0436\u0434\u0443 Unity \u0438 Python \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u043c. <\/p>\n
\n\u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430:<\/summary>\n
\n
Unity \u2013 \u0411\u0440\u0430\u0443\u0437\u0435\u0440 (\u0436\u0435\u043b\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0432 \u043e\u0431\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b)<\/strong><\/p>\n
<\/figure>\n
<\/figure>\n
Unity \u2013 Python:<\/strong><\/p>\n
<\/figure>\n
<\/figure>\n<\/p>\n<\/div>\n<\/details>\n
\u0412\u0443\u0430\u043b\u044f, \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0438 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u044e\u0442\u0441\u044f, \u0430 \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442 \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 \u0437\u0430\u043a\u043e\u043d\u0447\u0438\u043b\u0430\u0441\u044c 3 \u0447\u0430\u0441\u0442\u044c.<\/p>\n\n
\u0427\u0430\u0441\u0442\u044c 4. \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 WebRTC Media streaming<\/h2>\n
\u0412 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0445 \u0447\u0430\u0441\u0442\u044f\u0445 \u0443 \u043d\u0430\u0441 \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u043e\u0441\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c datachannel \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c-python-unity, \u0442\u0435\u043f\u0435\u0440\u044c \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u043f\u043e\u0440\u0430 \u043e\u0431\u043e\u0433\u0430\u0442\u0438\u0442\u044c \u043c\u0435\u0434\u0438\u0430\u043a\u043e\u043d\u0442\u0435\u043d\u0442\u043e\u043c.<\/p>\n
\u0421\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442<\/h3>\n
 \u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u0443\u044e \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0443 main.html \u043d\u043e\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u0432\u0438\u0434\u0435\u043e<\/p>\n
\nmain.html<\/summary>\n
\n
... <div class=\"row-md-6\">   <form class=\"form-inline\">     <button id=\"startStream\" class=\"btn btn-primary\" type=\"submit\">Start media streaming<\/button>   <\/form>   <\/div>   <div class=\"row-md-6\">     <video autoplay id=\"myvideo\" width=\"320\" height=\"240\" controls><\/video>     <video autoplay id=\"remoteVideo\" width=\"320\" height=\"240\" controls><\/video> <\/div> ...<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
 \u0414\u043e\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u043d\u0430\u0448 \u0441\u043a\u0440\u0438\u043f\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n
\nrobo.js<\/summary>\n
\n
... const constraints = {   video: true, audio: true }; var videoStream; ...  \/\/ \u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0432 function initRTCPeerConnection() \/\/ video handling const remoteVideo = document.getElementById('remoteVideo'); peerConnection.addEventListener('track', async (event) => {   const remoteStream = event.streams[0];   remoteVideo.srcObject = remoteStream;   console.log('Received remote stream'); });  \/\/ \u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0441\u0442\u0430\u0440\u0442 \u043c\u0435\u0434\u0438\u0430 \u0441\u0442\u0440\u0438\u043c\u0438\u043d\u0433\u0430: function statrStream(){   navigator.mediaDevices.getUserMedia(constraints)   .then(stream => {     videoStream = stream;     stream.getTracks().forEach(track => {       peerConnection.addTrack(track, videoStream);       console.log(\"added track:\" + track);     });       console.log(\"sucsess started media stream\");     recreateOffer();   })   .catch(function(err){     console.log(\"errors when media stream\");   });   attachVideoToScreen(); }  function recreateOffer(){   peerConnection.createOffer(function(offer) {     connection.send(JSON.stringify({'userId' : userId, 'type' : 'OFFER', 'payload' : offer , 'toUserId' : $(\"#offerTo\").val()}));     peerConnection.setLocalDescription(offer);   },   function(error) {     console.log(\"error in offer creating:\" + error);   }); }  function attachVideoToScreen(){   const localvideo = document.getElementById('myvideo');   if (videoStream != null) {     localvideo.srcObject = videoStream;     localvideo.onloadedmetadata = () => {       localvideo.play();     }     console.log(\"sucsess attached media stream\");   } else {     setTimeout(attachVideoToScreen, 500);   } }  \/\/ \u041d\u0435 \u0437\u0430\u0431\u044b\u0432\u0430\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439: ... $( \"#startStream\" ).click(function() { statrStream(); }); ...<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c USB-\u043a\u0430\u043c\u0435\u0440\u0443 \u043a \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u0443 \u0438 \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u0440\u0430\u0431\u043e\u0442\u044b \u0432\u0438\u0434\u0435\u043e\/\u0430\u0443\u0434\u0438\u043e \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u043c\u0438 \u0432 \u043e\u0431\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u044f \u0434\u0435\u043b\u0430\u044e \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u0430 \u0438 \u0442\u0435\u043b\u0435\u0444\u043e\u043d\u0430 \u0438 \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e \u0432\u0441\u0435 \u0438\u0434\u0435\u0442 \u0443\u0441\u043f\u0435\u0448\u043d\u043e.<\/p>\n
\u0418\u0441\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442(Python-\u0441\u043a\u0440\u0438\u043f\u0442 \u043d\u0430 RPI)<\/h3>\n
\u041f\u0440\u0438 \u043f\u043e\u0441\u0442\u0443\u043f\u043b\u0435\u043d\u0438\u0438 offer \u043e\u0442 \u0423\u043f\u0440\u0430\u0432\u043b\u044f\u044e\u0449\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0432\u0438\u0434\u0435\u043e \u0441 USB-\u043a\u0430\u043c\u0435\u0440\u044b \u0438 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0432\u0438\u0434\u0435\u043e\u0442\u0440\u0430\u043a, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a webrtc-connection. \u0412 \u043f\u0430\u043a\u0435\u0442\u0435 aiortc \u0434\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u043c\u0435\u0434\u0438\u0430 \u0435\u0441\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0445\u0435\u043b\u043f\u0435\u0440\u044b<\/a>. \u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u0438\u0445 \u0432 \u043d\u0430\u0448\u0435\u043c Python \u0441\u043a\u0440\u0438\u043f\u0442\u0435:<\/p>\n
\npart3.py<\/summary>\n
\n
## \u0434\u043e\u0431\u0430\u0432\u0438\u043c 2 \u043c\u0435\u0442\u043e\u0434\u0430: def force_codec(pc, sender, forced_codec):     kind = forced_codec.split(\"\/\")[0]     codecs = RTCRtpSender.getCapabilities(kind).codecs     transceiver = next(t for t in pc.getTransceivers() if t.sender == sender)     transceiver.setCodecPreferences(         [codec for codec in codecs if codec.mimeType == forced_codec]     )   async def add_video(peer_conn) -> None:     options = {\"framerate\": \"30\", \"video_size\": \"640x480\", \"preset\": \"fast\"}     relay_v = MediaRelay()     webcam = MediaPlayer(\"\/dev\/video0\", format=\"v4l2\", options=options)     video_sender = peer_conn.addTrack(relay_v.subscribe(webcam.video, buffered=False))     force_codec(peer_conn, video_sender, \"video\/H264\")  ## \u0418 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b \u0445\u0435\u043d\u0434\u043b\u0438\u043d\u0433\u0430 \u043e\u0444\u0444\u0435\u0440\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0432\u044b\u0437\u043e\u0432 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0438\u0434\u0435\u043e \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0443 \u043e\u0444\u0444\u0435\u0440\u0430 \u0441 \u043d\u043e\u0432\u044b\u043c \u043a\u0430\u043d\u0434\u0438\u0434\u0430\u0442\u043e\u043c.              await add_video(peer_conn)                          offer = await peer_conn.createOffer()             await peer_conn.setLocalDescription(offer)             await websocket.send(json.dumps({\"userId\": local_user_id, \"type\": \"OFFER\", \"data\": \"\",                                              \"payload\": {\"sdp\": offer.sdp, \"type\": offer.type},                                              \"toUserId\": msg.get(\"userId\")}))<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n
\u0425\u0435\u043b\u043f\u0435\u0440\u044b \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u044b \u043d\u0430 ffmpeg \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u043f\u0446\u0438\u0439 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0432\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u043e\u043f\u0446\u0438\u0438 \u0434\u043b\u044f \u0443\u0441\u043a\u043e\u0440\u0435\u043d\u0438\u044f ffmpeg, \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u043e \u0434\u043b\u044f \u0441\u043d\u0438\u0436\u0435\u043d\u0438\u044f \u0437\u0430\u0434\u0435\u0440\u0436\u0435\u043a \u0432\u0438\u0434\u0435\u043e.<\/p>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0441\u0442\u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u0440\u0430\u0431\u043e\u0442\u044b \u043c\u0435\u0436\u0434\u0443 Python \u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c. \u0415\u0441\u043b\u0438 \u0432\u0434\u0440\u0443\u0433 \u043c\u0435\u0434\u0438\u0430 \u0442\u0440\u0430\u043a\u0438 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u044e\u0442\u0441\u044f \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435, \u043d\u043e \u0432\u0438\u0434\u0435\u043e \u043d\u0435 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0441\u044f — \u0442\u043e \u043f\u0435\u0440\u0435\u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u0445\u0440\u043e\u043c, \u0442\u0430\u043a \u0436\u0435 \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u043c — chrome:\/\/webrtc-internals\/<\/em><\/p>\n
\n\u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430:<\/summary>\n
\n
<\/figure>\n
<\/figure>\n<\/p>\n<\/div>\n<\/details>\n
\u0423\u043f\u0440\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442(Unity VR)<\/h3>\n
\u0421 \u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u044c\u044e \u0432\u0441\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043b\u043e\u0436\u043d\u0435\u0435, \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c panel \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0432\u0438\u0434\u0435\u043e, \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u043e\u0434\u0443\u0431\u043b\u0438\u0440\u0443\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0439 \u0440\u0430\u043d\u0435\u0435 Connection Panel, \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u0443\u0435\u043c \u0435\u0433\u043e \u0432 Robo Video Panel, \u0443\u0434\u0430\u043b\u0438\u043c \u0438\u0437 \u043d\u0435\u0433\u043e \u0432\u0441\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u044b \u0438 \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432 \u043d\u0435\u0433\u043e 2 \u043d\u043e\u0432\u044b\u0445 \u043e\u0431\u044a\u0435\u043a\u0442\u0430:<\/p>\n