html - 在 google colab 中显示大型视频文件

Question

在 google colab 中显示视频的常用方式是这样的：

from IPython.display import HTML
from base64 import b64encode
with open('video.mp4', 'rb') as f:
   display(HTML('<video><source src="data:video/mp4;base64,%s" type="video/mp4"></video>'%b64encode(f.read()).decode()))

但是对于中等大小的视频文件，比如几十 MB，这将导致 colab 断开连接（仅显示“运行时断开连接”）并且不会显示视频。确实，尝试将这么长的字符串写入 HTML 似乎并不明智。什么是最简单的解决方法？请注意，由于 CORS，HTML 无法访问本地文件系统。

标签： htmlvideobase64google-colaboratory

Answer 1

不需要 base64 编码。您可以使用普通<video>标签进行嵌入。

这是一个完整的例子： https ://colab.research.google.com/drive/1GqZvHmOwGpo9QsrxeEpH93kswgVliQQl

在此处复制代码：

# Download a video file to be served locally.
!wget https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4

# Start a webserver in the background, running on port 8000.
%%script bash --bg
python3 -m http.server 8000

# Embed the video file.
%%html
<video controls autoplay><source src="http://localhost:8000/flower.mp4" type="video/mp4"></video>

结果是一个典型的视频嵌入：

Colab 会自动将 HTTP 请求从 Javascript 代理到 locahost 到后端 VM。此处的文档中描述了有关此工作原理的更多详细信息： https ://colab.research.google.com/notebooks/snippets/advanced_outputs.ipynb#scrollTo=R8ZvCXC5A0wT