gs对话接入

本次代码评审新增并完善了gs视频聊天功能,包括前后端接口定义、状态管理及UI组件实现,并引入了新的依赖库以支持更多互动特性。
Link: https://code.alibaba-inc.com/xr-paas/gradio_webrtc/codereview/21273476
* 更新python 部分

* 合并videochat前端部分

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 替换audiowave

* 导入路径修改

* 合并websocket mode逻辑

* feat: gaussian avatar chat

* 增加其他渲染的入参

* feat: ws连接和使用

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 右边距离超出容器宽度,则向左移动

* 配置传递

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 高斯包异常

* 同步webrtc_utils

* 更新webrtc_utils

* 兼容on_chat_datachannel

* 修复设备名称列表没有正常显示的问题

* copy 传递 webrtc_id

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 保证webrtc 完成后再进行websocket连接

* feat: 音频表情数据接入

* dist 上传

* canvas 隐藏

* feat: 高斯文件下载进度透出

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 修改无法获取权限问题

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 先获取权限再获取设备

* fix: gs资源下载完成前不处理ws数据

* fix: merge

* 话术调整

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 修复设备切换后重新对话,又切换回默认设备的问题

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 更新localvideo 尺寸

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 不能默认default

* 修改音频权限问题

* 更新打包结果

* fix: 对话按钮状态跟gs资源挂钩,删除无用代码

* fix: merge

* feat: gs渲染模块从npm包引入

* fix

* 新增对话记录

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 样式修改

* 更新包

* fix: gs数字人初始化位置和静音

* 对话记录滚到底部

* 至少100%高度

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 略微上移文本框

* 开始连接时清空对话记录

* fix: update gs render npm

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 逻辑保证

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* feat: 音频初始化配置是否静音

* actionsbar在有字幕时调整位置

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 样式优化

* feat: 增加readme

* fix: 资源图片

* fix: docs

* fix: update gs render sdk

* fix: gs模式下画面位置计算

* fix: update readme

* 设备判断,太窄处理

* Merge branch 'feature/update-fastrtc-0.0.19' of gitlab.alibaba-inc.com:xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* 是否有权限和是否有设备分开

* feat: gs 下载和加载钩子函数分离

* Merge branch 'feature/update-fastrtc-0.0.19' of http://gitlab.alibaba-inc.com/xr-paas/gradio_webrtc into feature/update-fastrtc-0.0.19

* fix: update gs render sdk

* 替换

* dist

* 上传文件

* del
This commit is contained in:
neil.xh
2025-04-16 19:09:04 +08:00
parent 06885d06c4
commit f476f9cf29
54 changed files with 4980 additions and 23257 deletions

View File

@@ -1 +0,0 @@
(function(){"use strict";const R="https://unpkg.com/@ffmpeg/core@0.12.6/dist/umd/ffmpeg-core.js";var E;(function(t){t.LOAD="LOAD",t.EXEC="EXEC",t.WRITE_FILE="WRITE_FILE",t.READ_FILE="READ_FILE",t.DELETE_FILE="DELETE_FILE",t.RENAME="RENAME",t.CREATE_DIR="CREATE_DIR",t.LIST_DIR="LIST_DIR",t.DELETE_DIR="DELETE_DIR",t.ERROR="ERROR",t.DOWNLOAD="DOWNLOAD",t.PROGRESS="PROGRESS",t.LOG="LOG",t.MOUNT="MOUNT",t.UNMOUNT="UNMOUNT"})(E||(E={}));const a=new Error("unknown message type"),f=new Error("ffmpeg is not loaded, call `await ffmpeg.load()` first"),u=new Error("failed to import ffmpeg-core.js");let r;const O=async({coreURL:t,wasmURL:n,workerURL:e})=>{const o=!r;try{t||(t=R),importScripts(t)}catch{if(t||(t=R.replace("/umd/","/esm/")),self.createFFmpegCore=(await import(t)).default,!self.createFFmpegCore)throw u}const s=t,c=n||t.replace(/.js$/g,".wasm"),b=e||t.replace(/.js$/g,".worker.js");return r=await self.createFFmpegCore({mainScriptUrlOrBlob:`${s}#${btoa(JSON.stringify({wasmURL:c,workerURL:b}))}`}),r.setLogger(i=>self.postMessage({type:E.LOG,data:i})),r.setProgress(i=>self.postMessage({type:E.PROGRESS,data:i})),o},l=({args:t,timeout:n=-1})=>{r.setTimeout(n),r.exec(...t);const e=r.ret;return r.reset(),e},m=({path:t,data:n})=>(r.FS.writeFile(t,n),!0),D=({path:t,encoding:n})=>r.FS.readFile(t,{encoding:n}),S=({path:t})=>(r.FS.unlink(t),!0),I=({oldPath:t,newPath:n})=>(r.FS.rename(t,n),!0),L=({path:t})=>(r.FS.mkdir(t),!0),N=({path:t})=>{const n=r.FS.readdir(t),e=[];for(const o of n){const s=r.FS.stat(`${t}/${o}`),c=r.FS.isDir(s.mode);e.push({name:o,isDir:c})}return e},A=({path:t})=>(r.FS.rmdir(t),!0),w=({fsType:t,options:n,mountPoint:e})=>{const o=t,s=r.FS.filesystems[o];return s?(r.FS.mount(s,n,e),!0):!1},k=({mountPoint:t})=>(r.FS.unmount(t),!0);self.onmessage=async({data:{id:t,type:n,data:e}})=>{const o=[];let s;try{if(n!==E.LOAD&&!r)throw f;switch(n){case E.LOAD:s=await O(e);break;case E.EXEC:s=l(e);break;case E.WRITE_FILE:s=m(e);break;case E.READ_FILE:s=D(e);break;case E.DELETE_FILE:s=S(e);break;case E.RENAME:s=I(e);break;case E.CREATE_DIR:s=L(e);break;case E.LIST_DIR:s=N(e);break;case E.DELETE_DIR:s=A(e);break;case E.MOUNT:s=w(e);break;case E.UNMOUNT:s=k(e);break;default:throw a}}catch(c){self.postMessage({id:t,type:E.ERROR,data:c.toString()});return}s instanceof Uint8Array&&o.push(s.buffer),self.postMessage({id:t,type:n,data:s},o)}})();

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -1 +0,0 @@
(function(){"use strict";const R="https://unpkg.com/@ffmpeg/core@0.12.6/dist/umd/ffmpeg-core.js";var E;(function(t){t.LOAD="LOAD",t.EXEC="EXEC",t.WRITE_FILE="WRITE_FILE",t.READ_FILE="READ_FILE",t.DELETE_FILE="DELETE_FILE",t.RENAME="RENAME",t.CREATE_DIR="CREATE_DIR",t.LIST_DIR="LIST_DIR",t.DELETE_DIR="DELETE_DIR",t.ERROR="ERROR",t.DOWNLOAD="DOWNLOAD",t.PROGRESS="PROGRESS",t.LOG="LOG",t.MOUNT="MOUNT",t.UNMOUNT="UNMOUNT"})(E||(E={}));const a=new Error("unknown message type"),f=new Error("ffmpeg is not loaded, call `await ffmpeg.load()` first"),u=new Error("failed to import ffmpeg-core.js");let r;const O=async({coreURL:t,wasmURL:n,workerURL:e})=>{const o=!r;try{t||(t=R),importScripts(t)}catch{if(t||(t=R.replace("/umd/","/esm/")),self.createFFmpegCore=(await import(t)).default,!self.createFFmpegCore)throw u}const s=t,c=n||t.replace(/.js$/g,".wasm"),b=e||t.replace(/.js$/g,".worker.js");return r=await self.createFFmpegCore({mainScriptUrlOrBlob:`${s}#${btoa(JSON.stringify({wasmURL:c,workerURL:b}))}`}),r.setLogger(i=>self.postMessage({type:E.LOG,data:i})),r.setProgress(i=>self.postMessage({type:E.PROGRESS,data:i})),o},l=({args:t,timeout:n=-1})=>{r.setTimeout(n),r.exec(...t);const e=r.ret;return r.reset(),e},m=({path:t,data:n})=>(r.FS.writeFile(t,n),!0),D=({path:t,encoding:n})=>r.FS.readFile(t,{encoding:n}),S=({path:t})=>(r.FS.unlink(t),!0),I=({oldPath:t,newPath:n})=>(r.FS.rename(t,n),!0),L=({path:t})=>(r.FS.mkdir(t),!0),N=({path:t})=>{const n=r.FS.readdir(t),e=[];for(const o of n){const s=r.FS.stat(`${t}/${o}`),c=r.FS.isDir(s.mode);e.push({name:o,isDir:c})}return e},A=({path:t})=>(r.FS.rmdir(t),!0),w=({fsType:t,options:n,mountPoint:e})=>{const o=t,s=r.FS.filesystems[o];return s?(r.FS.mount(s,n,e),!0):!1},k=({mountPoint:t})=>(r.FS.unmount(t),!0);self.onmessage=async({data:{id:t,type:n,data:e}})=>{const o=[];let s;try{if(n!==E.LOAD&&!r)throw f;switch(n){case E.LOAD:s=await O(e);break;case E.EXEC:s=l(e);break;case E.WRITE_FILE:s=m(e);break;case E.READ_FILE:s=D(e);break;case E.DELETE_FILE:s=S(e);break;case E.RENAME:s=I(e);break;case E.CREATE_DIR:s=L(e);break;case E.LIST_DIR:s=N(e);break;case E.DELETE_DIR:s=A(e);break;case E.MOUNT:s=w(e);break;case E.UNMOUNT:s=k(e);break;default:throw a}}catch(c){self.postMessage({id:t,type:E.ERROR,data:c.toString()});return}s instanceof Uint8Array&&o.push(s.buffer),self.postMessage({id:t,type:n,data:s},o)}})();

View File

@@ -1,222 +0,0 @@
var v;
(function(e) {
e.LOAD = "LOAD", e.EXEC = "EXEC", e.WRITE_FILE = "WRITE_FILE", e.READ_FILE = "READ_FILE", e.DELETE_FILE = "DELETE_FILE", e.RENAME = "RENAME", e.CREATE_DIR = "CREATE_DIR", e.LIST_DIR = "LIST_DIR", e.DELETE_DIR = "DELETE_DIR", e.ERROR = "ERROR", e.DOWNLOAD = "DOWNLOAD", e.PROGRESS = "PROGRESS", e.LOG = "LOG", e.MOUNT = "MOUNT", e.UNMOUNT = "UNMOUNT";
})(v || (v = {}));
const {
SvelteComponent: X,
append_hydration: T,
attr: I,
binding_callbacks: j,
children: A,
claim_element: N,
claim_text: Q,
detach: a,
element: k,
empty: b,
init: z,
insert_hydration: O,
is_function: p,
listen: L,
noop: y,
run_all: B,
safe_not_equal: H,
set_data: Y,
src_url_equal: w,
text: Z,
toggle_class: d
} = window.__gradio__svelte__internal;
function S(e) {
let l;
function t(u, i) {
return J;
}
let o = t()(e);
return {
c() {
o.c(), l = b();
},
l(u) {
o.l(u), l = b();
},
m(u, i) {
o.m(u, i), O(u, l, i);
},
p(u, i) {
o.p(u, i);
},
d(u) {
u && a(l), o.d(u);
}
};
}
function J(e) {
let l, t, n, o, u;
return {
c() {
l = k("div"), t = k("video"), this.h();
},
l(i) {
l = N(i, "DIV", { class: !0 });
var c = A(l);
t = N(c, "VIDEO", { src: !0 }), A(t).forEach(a), c.forEach(a), this.h();
},
h() {
var i;
w(t.src, n = /*value*/
(i = e[2]) == null ? void 0 : i.video.url) || I(t, "src", n), I(l, "class", "container svelte-1uoo7dd"), d(
l,
"table",
/*type*/
e[0] === "table"
), d(
l,
"gallery",
/*type*/
e[0] === "gallery"
), d(
l,
"selected",
/*selected*/
e[1]
);
},
m(i, c) {
O(i, l, c), T(l, t), e[6](t), o || (u = [
L(
t,
"loadeddata",
/*init*/
e[4]
),
L(t, "mouseover", function() {
p(
/*video*/
e[3].play.bind(
/*video*/
e[3]
)
) && e[3].play.bind(
/*video*/
e[3]
).apply(this, arguments);
}),
L(t, "mouseout", function() {
p(
/*video*/
e[3].pause.bind(
/*video*/
e[3]
)
) && e[3].pause.bind(
/*video*/
e[3]
).apply(this, arguments);
})
], o = !0);
},
p(i, c) {
var _;
e = i, c & /*value*/
4 && !w(t.src, n = /*value*/
(_ = e[2]) == null ? void 0 : _.video.url) && I(t, "src", n), c & /*type*/
1 && d(
l,
"table",
/*type*/
e[0] === "table"
), c & /*type*/
1 && d(
l,
"gallery",
/*type*/
e[0] === "gallery"
), c & /*selected*/
2 && d(
l,
"selected",
/*selected*/
e[1]
);
},
d(i) {
i && a(l), e[6](null), o = !1, B(u);
}
};
}
function K(e) {
let l, t = (
/*value*/
e[2] && S(e)
);
return {
c() {
t && t.c(), l = b();
},
l(n) {
t && t.l(n), l = b();
},
m(n, o) {
t && t.m(n, o), O(n, l, o);
},
p(n, [o]) {
/*value*/
n[2] ? t ? t.p(n, o) : (t = S(n), t.c(), t.m(l.parentNode, l)) : t && (t.d(1), t = null);
},
i: y,
o: y,
d(n) {
n && a(l), t && t.d(n);
}
};
}
function P(e, l, t) {
var n = this && this.__awaiter || function(f, G, s, R) {
function W(E) {
return E instanceof s ? E : new s(function(m) {
m(E);
});
}
return new (s || (s = Promise))(function(E, m) {
function q(r) {
try {
h(R.next(r));
} catch (D) {
m(D);
}
}
function V(r) {
try {
h(R.throw(r));
} catch (D) {
m(D);
}
}
function h(r) {
r.done ? E(r.value) : W(r.value).then(q, V);
}
h((R = R.apply(f, G || [])).next());
});
};
let { type: o } = l, { selected: u = !1 } = l, { value: i } = l, { loop: c } = l, _;
function U() {
return n(this, void 0, void 0, function* () {
t(3, _.muted = !0, _), t(3, _.playsInline = !0, _), t(3, _.controls = !1, _), _.setAttribute("muted", ""), yield _.play(), _.pause();
});
}
function C(f) {
j[f ? "unshift" : "push"](() => {
_ = f, t(3, _);
});
}
return e.$$set = (f) => {
"type" in f && t(0, o = f.type), "selected" in f && t(1, u = f.selected), "value" in f && t(2, i = f.value), "loop" in f && t(5, c = f.loop);
}, [o, u, i, _, U, c, C];
}
class M extends X {
constructor(l) {
super(), z(this, l, P, K, H, { type: 0, selected: 1, value: 2, loop: 5 });
}
}
export {
M as default
};

View File

@@ -1 +0,0 @@
.container.svelte-1uoo7dd{flex:none;max-width:none}.container.svelte-1uoo7dd video{width:var(--size-full);height:var(--size-full);object-fit:cover}.container.svelte-1uoo7dd:hover,.container.selected.svelte-1uoo7dd{border-color:var(--border-color-accent)}.container.table.svelte-1uoo7dd{margin:0 auto;border:2px solid var(--border-color-primary);border-radius:var(--radius-lg);overflow:hidden;width:var(--size-20);height:var(--size-20);object-fit:cover}.container.gallery.svelte-1uoo7dd{height:var(--size-20);max-height:var(--size-20);object-fit:cover}

View File

@@ -360,6 +360,10 @@ class StreamHandlerBase(ABC):
)
yield from self._resampler.resample(frame)
class StreamHandlerFactory(ABC):
@abstractmethod
def create(id:str)-> StreamHandlerBase:
pass
EmitType: TypeAlias = (
tuple[int, npt.NDArray[np.int16 | np.float32]]
@@ -381,7 +385,7 @@ class StreamHandler(StreamHandlerBase):
pass
@abstractmethod
def copy(self) -> StreamHandler:
def copy(self, **kwargs) -> StreamHandler:
pass
def start_up(self):
@@ -398,12 +402,15 @@ class AsyncStreamHandler(StreamHandlerBase):
pass
@abstractmethod
def copy(self) -> AsyncStreamHandler:
def copy(self, **kwargs) -> AsyncStreamHandler:
pass
async def start_up(self):
pass
async def on_chat_datachannel(self, message: dict,channel):
pass
StreamHandlerImpl = StreamHandler | AsyncStreamHandler
@@ -418,7 +425,7 @@ class AudioVideoStreamHandler(StreamHandler):
pass
@abstractmethod
def copy(self) -> AudioVideoStreamHandler:
def copy(self, **kwargs) -> AudioVideoStreamHandler:
pass
@@ -432,7 +439,7 @@ class AsyncAudioVideoStreamHandler(AsyncStreamHandler):
pass
@abstractmethod
def copy(self) -> AsyncAudioVideoStreamHandler:
def copy(self, **kwargs) -> AsyncAudioVideoStreamHandler:
pass

View File

@@ -10,6 +10,7 @@ from typing import (
Concatenate,
Iterable,
Literal,
Optional,
ParamSpec,
Sequence,
TypeVar,
@@ -84,12 +85,18 @@ class WebRTC(Component, WebRTCConnectionMixin):
time_limit: float | None = None,
mode: Literal["send-receive", "receive", "send"] = "send-receive",
modality: Literal["video", "audio", "audio-video"] = "video",
video_chat: bool = True,
rtp_params: dict[str, Any] | None = None,
icon: str | None = None,
icon_button_color: str | None = None,
pulse_color: str | None = None,
icon_radius: int | None = None,
button_labels: dict | None = None,
#video_chat = True 后生效
avatar_type: Optional['gs'] = None,
avatar_ws_route: str | None = None,
avatar_assets_path: str | None = None
):
"""
Parameters:
@@ -123,6 +130,13 @@ class WebRTC(Component, WebRTCConnectionMixin):
button_labels: Text to display on the audio or video start, stop, waiting buttons. Dict with keys "start", "stop", "waiting" mapping to the text to display on the buttons.
icon_radius: Border radius of the icon button expressed as a percentage of the button size. Default is 50%
"""
self.video_chat = video_chat
if video_chat is True:
mode = 'send-receive'
modality = 'audio-video'
self.avatar_type = avatar_type
self.avatar_ws_route = avatar_ws_route
self.avatar_assets_path = avatar_assets_path
WebRTCConnectionMixin.__init__(self)
self.time_limit = time_limit
self.height = height

View File

@@ -4,6 +4,7 @@ from __future__ import annotations
import asyncio
import inspect
import json
import logging
from collections import defaultdict
from collections.abc import Callable
@@ -30,6 +31,7 @@ from fastrtc.tracks import (
ServerToClientAudio,
ServerToClientVideo,
StreamHandlerBase,
StreamHandlerFactory,
StreamHandlerImpl,
VideoCallback,
VideoEventHandler,
@@ -246,7 +248,7 @@ class WebRTCConnectionMixin:
self.pcs[body["webrtc_id"]] = pc
if isinstance(self.event_handler, StreamHandlerBase):
handler = self.event_handler.copy()
handler = self.event_handler.copy(webrtc_id=body['webrtc_id'])
handler.emit = webrtc_error_handler(handler.emit) # type: ignore
handler.receive = webrtc_error_handler(handler.receive) # type: ignore
handler.start_up = webrtc_error_handler(handler.start_up) # type: ignore
@@ -255,6 +257,9 @@ class WebRTCConnectionMixin:
handler.video_receive = webrtc_error_handler(handler.video_receive) # type: ignore
if hasattr(handler, "video_emit"):
handler.video_emit = webrtc_error_handler(handler.video_emit) # type: ignore
if hasattr(handler, "on_pc_connected"):
handler.on_pc_connected(body["webrtc_id"])
elif isinstance(self.event_handler, VideoStreamHandler):
self.event_handler.callable = cast(
VideoEventHandler, webrtc_error_handler(self.event_handler.callable)
@@ -265,6 +270,7 @@ class WebRTCConnectionMixin:
self.handlers[body["webrtc_id"]] = handler
@pc.on("iceconnectionstatechange")
async def on_iceconnectionstatechange():
logger.debug("ICE connection state change %s", pc.iceConnectionState)
@@ -393,6 +399,23 @@ class WebRTCConnectionMixin:
def _(message):
logger.debug(f"Received message: {message}")
if channel.readyState == "open":
def parse_json_safely(str: str):
try:
result = json.loads(str)
return result, None
except json.JSONDecodeError as e:
# print(f"JSON解析错误: {e.msg}")
return None, e
msg_dict,error = parse_json_safely(message)
if(error is None and msg_dict['type'] in ['chat','stop_chat', 'init']):
msg_dict = cast(dict, json.loads(message))
handler = self.handlers[body["webrtc_id"]]
if inspect.iscoroutinefunction(handler.on_chat_datachannel):
asyncio.create_task(
handler.on_chat_datachannel(msg_dict,channel))
else:
handler.on_chat_datachannel(msg_dict,channel)
else:
channel.send(
create_message("log", data=f"Server received: {message}")
)