python+qwen3-omni-flash-realtime+three实现网页中三维可爱机器人实时音视频ai聊天助手千问qwen示例代码

代码语言:python

所属分类:其他

代码描述:python+qwen3-omni-flash-realtime+three实现网页中三维可爱机器人实时音视频ai聊天助手千问qwen示例代码,一个three构建的可爱三维机器人与你视频聊天,她能看到你,支持语音打断,采用python内嵌html的单个python代码实现。

代码标签: python qwen3-omni-flash-realtime three 网页 三维 可爱 机器

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

# -- coding: utf-8 --
import uvicorn
from fastapi import FastAPI, WebSocket, WebSocketDisconnect
from fastapi.responses import HTMLResponse
import asyncio
import json
import websockets
import logging
import os

# ================= 配置区 =================
# ⚠️ 请务必替换为您的阿里云 DashScope API Key
API_KEY = "sk-****************"  # 替换为你的真实 Key

# 阿里云实时API地址
DASHSCOPE_URL = "wss://dashscope.aliyuncs.com/api-ws/v1/realtime?model=qwen3-omni-flash-realtime" 

app = FastAPI()

# 日志配置
logging.basicConfig(level=logging.INFO)
logger = logging.getLogger("RobotServer")

# ================= 前端 HTML/JS/CSS 代码 =================
html_content = """
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Omni Bot 3D Call</title>
    <style>
        body { margin: 0; overflow: hidden; background-color: #1a1a2e; font-family: 'Segoe UI', Roboto, sans-serif; }
        #canvas-container { width: 100vw; height: 100vh; display: block; position: absolute; top: 0; left: 0; z-index: 1; background: radial-gradient(circle at center, #2b3247 0%, #1a1a2e 100%); }
        
        /* UI 层 */
        #ui-layer {
            position: absolute; top: 20px; left: 20px; z-index: 10;
            color: white; pointer-events: none;
            text-shadow: 0 2px 4px rgba(0,0,0,0.5);
        }
        
        /* 用户摄像头小窗 */
        #user-video {
            position: absolute; bottom: 20px; right: 20px;
            width: 200px; height: 150px; border-radius: 12px;
            border: 2px solid rgba(255,255,255,0.2); 
            object-fit: cover; z-index: 10;
            background: #000; transform: scaleX(-1); /* 镜像 */
            box-shadow: 0 4px 15px rgba(0,0,0,0.5);
        }
        
        #controls { pointer-events: auto; margin-top: 15px; }
        
        button {
            padding: 12px 24px; border-radius: 30px; border: none;
            font-size: 16px; font-weight: bold; cursor: pointer;
            transition: all 0.3s ease; outline: none;
            box-shadow: 0 4px 6px rgba(0,0,0,0.2);
        }
        #btn-start { background: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%); color: white; }
        #btn-start:hover { transform: scale(1.05); box-shadow: 0 0 20px rgba(79, 172, 254, 0.6); }
        #btn-start:disabled { background: #444; color: #888; cursor: not-allowed; transform: none; box-shadow: none; }
        
        #btn-stop { background: #ff5858; c.........完整代码请登录后点击上方下载按钮下载查看

网友评论0