搭配使用 Alist 和 VideoTogether 实现同步观影

本文的目的在于有些想要同时使用 Alist 和 VideoTogether 的用户。教程主要面向使用体验，所以本文相对的是一个更面向小白的教程。当然前提最好是已经使用过 Alist 和 VideoTogether 的用户。

示例体验地址 https://libilibi.eu.org/

为什么用 Alist 和 VideoToghther

主要原因是 ViedeoTogether 虽然可以支持大多数的视频网站，但是无奈于各大视频网站其实体验并不好。正版网站之流基本都需要会员，而盗版网站经常遇到加载失败且非常不稳定。所以使用一个 “自己管理的视频网站” 来进行同步就很有必要了。使用 Alist 来进行视频播放刚好解决了这一点。

同时 Alist 可以通过全局自定义头部来添加 VideoTogether 到网站中。这样就不用要求每个小伙伴都安装好 VideoTogether 插件。而通过打开链接就可以直接同步。

部署 Alist

这部分主要参考 Alist 的官方文档。基本完全参考官方文档中的 Docker 方式。本文是安装到一台已经安装好 docker-compose 的 VPS 中 (这部分可以参考这个链接：Install the Compose plugin )。

当然 Alist 也可以部署到如群晖软路由等等各种奇怪的地方，具体可以参考 Alist 官方文档。

下面是一个部署的过程。

1. 通过 SSH 链接到 VPS 中

2. 在文档中复制官方的 docker-compose 文件到 VPS 中

Copy
version: '3.3'
services:
alist:
restart: always
volumes:
- '/etc/alist:/opt/alist/data'
ports:
- '5244:5244'
environment:
- PUID=0
- PGID=0
- UMASK=022
container_name: alist
image: 'xhofe/alist:main'

docker-compose 文件写好后用下面的命令启动。有的国内运营的 VPS，可能需要注意一下端口的开放情况。可能需要放行规则或者关闭防火墙。

Copy
copydocker-compose up -d

4. 这里就会启动容器，可以通过下面的命令查看。

Copy
copydocker ps

5. 通过以下的命令来查看 admin 密码。

Copy
copydocker exec -it alist ./alist admin

6. 接下来就可以通过 IP:5244 的方式来进行访问了。如果没有问题，就可以通过 admin 和上面的密码登录到后台了。

添加 VideoTogether 到网站中

根据 VideoTogether 的文档

只需要一条 script 就可以添加。

Copy
copy

1. 进入 Alist 后台，找到全局设置。

2.VideoToghther 的 script 到自定义头部中。

3. 保存好后回到主页就可看见右下角的 VideoTogether 按钮。

这里其实有个槽点在于 Alist 的工具栏和 VideoToghther 其实相互挡住了按钮。所以这里我们可以再添加一个自定义头部或者自定义内容来修改 Alist 按钮的位置。

Copy
copy
document.addEventListener("DOMContentLoaded", () => {
const seAList = document.createElement("style");

seAList.innerHTML = `
.left-toolbar-box {
left: var(--hope-space-5);
right: auto;
}
`;

document.body.appendChild(seAList);
});


就会变成下图的效果。这样能改善不少。

使用上的流程

至此，你就可以在 Alist 上添加各式各样的存储，并使用在线功能预览视频，加上网页上自带的 VideoTogether 来同步观看视频了。

不过需要注意的是，预览视频很看重视频的格式。如果你的视频有多音轨或者格式不算太主流，那么很多视频都会没有声音（算是最大的一个使用上问题）。