【简单有效!】Gradio利用html插件实现video视频流循环播放

ops/2025/3/28 7:41:27/

文章目录

  • 前言 & 思路
  • 静态资源挂载
  • 完整代码
  • 结果示例

前言 & 思路

  • 需要利用gradio前端搭建一个页面,循环播放视频。思路是直接调用gr.HTML插件实现,简单有效!!!

静态资源挂载

app.mount("/static", StaticFiles(directory="/mnt/f/VideoChat-cascade_only/static"), name="static")

完整代码

注意:挂载以后,便可以通过static/Avatar1.mp4访问到静态的视频资源啦!

  • 利用loop autoplay muted便可以实现视频循环播放!!!
import gradio as gr
import uvicorn
from fastapi import FastAPI
from fastapi.staticfiles import StaticFilesdef create_gradio():html_content = """<div style="height: 500px; width: 360px;margin: auto;"><video class="video_box" loop autoplay muted><source src="static/Avatar1.mp4" type="video/mp4"><span>This video browser does not support</span></video></div>"""# 创建 Gradio 界面with gr.Blocks() as demo:gr.HTML(html_content, visible=True)return demoapp = FastAPI()
app.mount("/static", StaticFiles(directory="/mnt/f/gradio_demo/static"), name="static")
gradio_app = create_gradio()
app = gr.mount_gradio_app(app, gradio_app, path='/')
uvicorn.run(app, port = 9999)

结果示例

在这里插入图片描述


http://www.ppmy.cn/ops/167532.html

相关文章

【最新版】龙兵名片V152独立版系统源码+在线更新+搭建教程

一.介绍 龙兵名片独立版系统源码V152版本&#xff0c;支持后台在线更新升级&#xff0c;全插件版本 持续更新中&#xff01; 总体使用特别的稳定没有出现什么bug问题&#xff0c;老版本的用户可以升级 二.搭建环境 系统环境&#xff1a;CentOS、 运行环境&#xff1a;宝塔 …

RC5在线加密工具

RC5 是一种对称密钥加密算法&#xff0c;由 Ronald Rivest 于 1994 年设计&#xff0c;具有可变密钥长度、轮数和块大小&#xff0c;适用于多种应用场景。 开发调试可以结合在线工具使用 RC5在线加密工具 RC5在线加密工具加密模式支持ECB、CBC、CFB、OFB、CTR等模式。

在LwIP中,`tcp_recved()`、`tcp_sndbuf()` 和 `tcp_write()`三个函数详细用法及示例

在LwIP中&#xff0c;tcp_recved()、tcp_sndbuf() 和 tcp_write() 是TCP协议栈的核心函数&#xff0c;用于管理接收和发送数据流。以下是它们的详细用法及示例&#xff1a; 1. tcp_recved() 功能 通知协议栈已处理接收数据&#xff1a;当应用层从接收缓冲区读取数据后&#x…

CVPR2025 | 对抗样本智能安全方向论文汇总 | 持续更新中~

汇总结果来源&#xff1a;CVPR 2025 Accepted Papers 若文中出现的 论文链接 和 GitHub链接 点不开&#xff0c;则说明还未公布&#xff0c;在公布后笔者会及时添加. 若笔者未及时添加&#xff0c;欢迎读者告知. 文章根据题目关键词搜索&#xff0c;可能会有遗漏. 若笔者出现…

DeepSeek的智能IT核心技术矩阵

1. MLA-MTP双引擎架构 多头潜在注意力&#xff08;MLA&#xff09;&#xff1a;突破传统Transformer的计算瓶颈&#xff0c;实现输入文本的多维度并行解析。在代码审查场景中&#xff0c;MLA可同时识别语法错误、逻辑漏洞和安全风险三类问题&#xff0c;使静态分析效率提升400…

Node.js技术原理分析系列6——基于 V8 封装一个自己的 JavaScript 运行时

Node.js 是一个开源的、跨平台的JavaScript运行时环境&#xff0c;它允许开发者在服务器端运行JavaScript代码。Node.js 是基于Chrome V8引擎构建的&#xff0c;专为高性能、高并发的网络应用而设计&#xff0c;广泛应用于构建服务器端应用程序、网络应用、命令行工具等。 本系…

JVM垃圾回收

1. Java垃圾回收机制 为了让程序员更专注于代码的实现&#xff0c;而不用过多的考虑内存释放的问题&#xff0c;所以&#xff0c;在Java语言中&#xff0c;有了自动的垃圾回收机制&#xff0c;也就是我们熟悉的GC(Garbage Collection)。有了垃圾回收机制后&#xff0c;程序员只…

JS—原型与原型链:2分钟掌握原型链

个人博客&#xff1a;haichenyi.com。感谢关注 一. 目录 一–目录二–原型三–原型链 二. 原型 什么是原型&#xff1f; 每个JavaScript对象都有一个原型&#xff0c;这个原型也是一个对象。比方说 function Person(name) {this.name name; } let person new Person(&quo…