html websocket调用千问qwen-livetranslate实时文字语音翻译api实现同声传译代码

代码语言:python

所属分类:其他

代码描述:html websocket调用千问qwen-livetranslate实时文字语音翻译api实现同声传译代码,实时识别麦克风人说话声音,克隆音色后自动翻译指定语音说话,并同步输出翻译后的文本。

代码标签: html websocket 千问 qwen-livetranslate 实时 文字 语音 翻译

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

import os
import json
import base64
import asyncio
from fastapi import FastAPI, WebSocket, WebSocketDisconnect
from fastapi.responses import HTMLResponse
import websockets
import uvicorn

app = FastAPI()

# 阿里云 DashScope API 配置
# 建议通过环境变量配置:export DASHSCOPE_API_KEY="your_key"
# 也可以直接在下方替换为您的实际 API Key
API_KEY = os.getenv("DASHSCOPE_API_KEY", "sk-")

# 内置 HTML & JavaScript 前端代码
HTML_CONTENT = """
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>千问实时语音翻译 (网页版)</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            background-color: #f4f6f8;
            margin: 0;
            padding: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        .container {
            background-color: #ffffff;
            border-radius: 12px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
            padding: 30px;
            width: 500px;
            max-width: 90%;
            text-align: center;
        }
        h2 {
            color: #333;
            margin-bottom: 24px;
        }
        .form-group {
            margin-bottom: 20px;
            text-align: left;
        }
        label {
            font-size: 14px;
            color: #666;
            font-weight: bold;
            display: block;
            margin-bottom: 8px;
        }
        select {
            width: 100%;
            padding: 10px;
            border-radius: 6px;
            border: 1px solid #ddd;
            background-color: #fff;
            font-size: 14px;
            outline: none;
        }
        .btn-group {
            display: flex;
            gap: 12px;
            m.........完整代码请登录后点击上方下载按钮下载查看

网友评论0