pip install channels

INSTALLED_APPS = [
    ...
    'channels',
    ...
]

ASGI_APPLICATION = "projetc2.asgi.application" #project2為項目名稱
CHANNEL_LAYERS = {
    'default': {
        'BACKEND': 'channels.layers.InMemoryChannelLayer',
    },
}

import os
from channels.routing import ProtocolTypeRouter, URLRouter
from django.core.asgi import get_asgi_application
from projetc2 import routing 
os.environ.setdefault('DJANGO_SETTINGS_MODULE', '項目名稱.settings')
application = ProtocolTypeRouter({
    "http": get_asgi_application(),
    "websocket": URLRouter(routing.websocket_urlpatterns)
})

from django.urls import re_path
from app import consumers
websocket_urlpatterns = [
    re_path(r'ws/some-path1/$', consumers.TailfConsumer.as_asgi()),
]

class TailfConsumer(AsyncWebsocketConsumer):
    async def connect(self):
        """
        這里定義連接建立時的邏輯
        """
        # 接受客戶端連接        
        await self.accept()
        # 開啟循環(huán)發(fā)送數(shù)據(jù)
        asyncio.ensure_future(self.send_data_loop())
    async def disconnect(self, close_code):
        # 連接斷開時的邏輯
        pass
    async def send_data_loop(self):
        while True:
            # 獲取數(shù)據(jù)
            data = await self.get_data()
            await self.send(json.dumps(data))
            await asyncio.sleep(1)  # 假設(shè)每秒發(fā)送一次數(shù)據(jù)
   async def get_data(self):
        """
        監(jiān)聽端口5000 ，實時獲取視頻圖像數(shù)據(jù)
        """
        import pickle
        import socket
        # 創(chuàng)建客戶端 socket 對象
        client_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
        # 設(shè)置服務(wù)器地址和端口號
        server_address = ('192.168.1.106', 5000)
        # 連接服務(wù)器
        client_socket.connect(server_address)
        decoded_data = {"leftimg":""}
        try:
            # 接收數(shù)據(jù)
            received_data = client_socket.recv(600000000)
            # 如果接收到數(shù)據(jù)，則進行處理
            if received_data:
                try:
                    decoded_data = pickle.loads(received_data)
                    # 在這里處理解碼后的數(shù)據(jù)
                except pickle.UnpicklingError as e:
                    # 處理解碼錯誤
                    print(f"Failed to decode pickle data: {e}")
                client_socket.close()
        except Exception as e:
            print('接收數(shù)據(jù)時出錯:', str(e))
        return decoded_data

import pickle
import socket
import threading
import cv2
import base64
video_source = 0
# 創(chuàng)建視頻捕獲對象
cap = cv2.VideoCapture(video_source)
# 獲取視頻的寬度和高度
width = int(cap.get(cv2.CAP_PROP_FRAME_WIDTH))
height = int(cap.get(cv2.CAP_PROP_FRAME_HEIGHT))
# 用于存儲連接的客戶端 Socket
client_sockets = []
import random
# 生成一個包含19個隨機整數(shù)的列表
# 創(chuàng)建 socket 對象
server_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
# 綁定服務(wù)器地址和端口
server_address = ('192.168.1.106', 5000)
server_socket.bind(server_address)
# 監(jiān)聽客戶端連接
server_socket.listen(1)
def image_to_base64(image):
    # 將圖像數(shù)據(jù)編碼為 Base64 字符串
    image_base64 = base64.b64encode(image).decode('utf-8')
    return image_base64
# 定義發(fā)送視頻數(shù)據(jù)的函數(shù)
def send_video_data():
    while True:
        ret, frame = cap.read()
        if not ret:
            break
        # 將圖像編碼為 JPEG 格式
        _, image_data = cv2.imencode('.jpg', frame)
        # 遍歷所有客戶端連接，發(fā)送視頻數(shù)據(jù)
        for client_socket in client_sockets:
            try:
                # 發(fā)送圖像數(shù)據(jù)
                encoded_data = pickle.dumps({
                    "leftimg": image_to_base64(image_data),
                })
                client_socket.sendall(encoded_data)
            except Exception as e:
                print(f"Error sending video data to client: {e}")
                client_socket.close()
                client_sockets.remove(client_socket)
# 定義處理客戶端連接的函數(shù)
def handle_client_connection(client_socket):
    while True:
        try:
            # 接收客戶端請求
            data = client_socket.recv(1024)
            if not data:
                break
            # 處理客戶端請求
            # 在此可以添加其他自定義邏輯
        except Exception as e:
            print(f"Error handling client connection: {e}")
            break
    # 關(guān)閉客戶端連接
    client_socket.close()
    client_sockets.remove(client_socket)
# 接受客戶端連接，并啟動視頻發(fā)送線程
def accept_client_connections():
    while True:
        client_socket, _ = server_socket.accept()
        client_sockets.append(client_socket)
# 啟動視頻發(fā)送線程和客戶端連接接受線程
send_thread = threading.Thread(target=send_video_data)
accept_thread = threading.Thread(target=accept_client_connections)
send_thread.start()
accept_thread.start()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<img  width="800" height="500" id="image">
<script>
    var socket = new WebSocket("ws://192.168.1.106:8000/ws/some-path1/");
    socket.onopen = function(event) {
        console.log("WebSocket連接已打開");
    };
    socket.onmessage = function(event) {
        // 接收到消息時的處理
        const imageData = event.data; // 從事件中獲取圖像數(shù)據(jù)
        // 在前端顯示圖像數(shù)據(jù)，這里假設(shè)有一個img元素來顯示圖像
        const imgElement = document.getElementById('image');
        imgElement.src = "data:image/jpeg;base64," + JSON.parse(imageData)["leftimg"];
    };
    socket.onclose = function(event) {
        console.log("WebSocket連接已關(guān)閉");
    };
</script>
</body>
</html>