python与html网页websocket视频通信,上硬货了

看抖音直播有遥控4g小车去买东西的。突然想自己做个遥控机器人给自己办事。AI当然不能差但是后期再说,把道路随便用神经网络映射下就可以自主送货了。

好了不吹牛了,第一步是视频通讯,如果远端是Windows当然最好容易开发但是成本太高了,闲置安卓手机虽然多,但是安卓编程阅读成本太高。剩下一个跨平台的html网页应用开发简单快速就选它了。服务端就用python。如果Windows平台肯定选UDP速度最快,可是网页环境只有tcp,只有玩websocket了。

上代码遍布下去了,复制粘贴就可以用。
细节自己去摸索吧。语音下个文章发。本地环境,上服务器环境我现在还用不到。
python服务器端代码

import base64
import asyncio
import websockets
import cv2
import math
import np


async def echo(websocket, path):
    #fetch msg
    async for message in websocket:
        #print("got a message:{}".format(message))
        #image = np.asarray(bytearray(message), dtype="uint8")
        #print(message)
        imm=base64.b64decode(message.split(',')[1])#去掉类型头
        #print(len(imm))


        im=np.asarray(list(imm), dtype="uint8")#解码成cv2可阅读的格式

        im2 = cv2.imdecode(im, cv2.IMREAD_COLOR)
        cv2.imshow('Image',im2)
        cv2.waitKey(1)
        
        
        
        #await websocket.send(message)
        
        

async def main():
    # 
    async with websockets.serve(echo, "192.168.1.102", 8765):
        await asyncio.Future()  # run forever

asyncio.run(main())

网页端

DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>自由网 -FDtitle>
head>
<body>
 
 

  <video id="video" src="">video>
  <canvas id="canvas">canvas>
body>
<script>
      //媒体对象
      var video = document.getElementById('video')

      var canvas = document.getElementById('canvas')
         canvas.width = 400;
         canvas.height = 300;



const mediaStreamConstraints = {
  video: true, 
  audio: false,
  video: {
            width: 400,
            height: 300,
			facingMode: "environment"
       }

};
function gotLocalMediaStream(mediaStream) {
  video.srcObject =  mediaStream//创建并实力化
    video.play();
	onetu();
	onetu();
	onetu();
}
// Create WebSocket connection.
const socket = new WebSocket('ws://192.168.1.102:8765');

// Connection opened
socket.addEventListener('open', function (event) {
    
});

// Listen for messages
socket.addEventListener('message', function (event) {
    console.log('Message from server ', event.data);
});
navigator.mediaDevices.getUserMedia(mediaStreamConstraints).then(gotLocalMediaStream).catch();

       var context = canvas.getContext("2d"); //c创建对象
        
         setInterval(function(){ //setTimeout(function(){//
          var co =   context.drawImage(video,0,0);//剪切图像
		  //console.log(co)
           img = context.getImageData(0, 0, 400, 300)//获取图片信息
           data = img.data//获取图片信息
		   context.putImageData(img,0,0)
		   
		   im=canvas.toDataURL("image/jpe")
		   //console.log(im)
		   //im2=base64ToBlob(im,"image/jpe")
           //console.log(Date())//打印时间
		   
		   if (socket.readyState==1){socket.send(im);}		    			        
         }, 43)   



//赋值粘贴即可用不懂的地方自己慢慢百度。注意ip地址填对,或者填本地。
script>
html>


怎么传视频我想秀一波。
需要审核,审核通过后我再贴进来。

websocket视频通讯

本节完,下节声音通讯,差点把我弄奔溃了,视频十几分钟的事,以为语音那不是两三分钟的事。虽然我们经常使用语音的即时通讯,但是此内容属于生僻内容非常难以跑通代码。网上又搜不到例子,我来打样例吧。

你可能感兴趣的:(跨平台应用,python,html,websocket)