Skip to content

[BUG] 使用自带网页视频播放器artplayer播放时,分片自动断续加载功能失效,无法正常使用网页播放。 #2289

@CwavGuy

Description

@CwavGuy

请确认以下事项

  • 我已确认阅读并同意 AGPL-3.0 第15条
    本程序不提供任何明示或暗示的担保,使用风险由您自行承担。

  • 我已确认阅读并同意 AGPL-3.0 第16条
    无论何种情况,版权持有人或其他分发者均不对使用本程序所造成的任何损失承担责任。

  • 我确认我的描述清晰,语法礼貌,能帮助开发者快速定位问题,并符合社区规则。

  • 我已确认阅读了OpenList文档

  • 我已确认没有重复的问题或讨论。

  • 我已确认是OpenList的问题,而不是其他原因(例如 网络依赖操作)。

  • 我认为此问题必须由OpenList处理,而非第三方。

  • 我已确认这个问题在最新版本中没有被修复。

  • 我没有阅读这个清单,只是闭眼选中了所有的复选框,请关闭这个 Issue 。

OpenList 版本(必填)

beta (Commit: 29447a4) - Frontend: rolling - Build at: 2026-03-26 13:02:17 +0000

使用的存储驱动(必填)

本机储存

问题描述(必填)

问题截图:
e1592c5a9b885addb2837a38198c3689
8184835144c05b536b465dcb03c76c2e

我部署oplist网盘,偶尔想在外面看一下直播录播,一般都是两三个小时,大约10多G的flv视频,很喜欢oplist自带播放器有挂载播放弹幕的功能。可是发现播放视频的时候出现问题,视频放一段时间会自己停下来等加载,而且一等加载就没完,除非手动拖一点进度条会加载一段,随后也没多久,也就几分钟又重复此问题,周而复始,尤其在手机上拖进度条很不方便。导致这个网页播放器几乎是不可用的状态。此问题和浏览器无关,安卓苹果windows的edge,chrome,firefox都有此问题。而后通过F12查看页面加载情况,发现前端不会自动从上一分片停止下载的位置重新安排下一分片的请求。我首先怀疑是artplayer的问题,因此我找了另一个部署了artplayer的应用作对比。

如上图,两张图左侧是其他部署artplayer的非openlist应用的console logs,右边是openlist部署的artplayer应用的console logs。可发现oplist的vedio.js播放视频在遇到的当前分片请求流传输buffer满了的时候会触发MSE SourceBuffer is full, suspend transmuxing task,停止该分片下载。等待播放到buffer到一定阈值,正常来说会如同右边那样从上一分片暂停位置重新发起一个分片加载请求,log显示“Continue loading from paused position”。然而在openlist部署的播放器中分片自动断续加载功能失效,导致视频播放到当前分片结尾的时候就直接卡死。我已经检查nginx反代配置,禁止了flv mp4等视频的所有缓存,以及设置的range相关header也能正常转发。

response header和request header等信息如下图所示:
image
image

我刚刚更新到beta-aio版本验证,已经是artplayer 5.4.0最新版,但问题依旧。另外设置中也基本没有可以对播放器已经调节的选项,我也无能为力。

个人能力时间有限,我无法确定这是artplayer的问题还是oplist设定的问题。但我尽力去找其他部署artplayer的应用来对比测试了。希望由此能获得oplist方面的支援。感激不尽!

日志(必填)

e1592c5a9b885addb2837a38198c3689 8184835144c05b536b465dcb03c76c2e image image

配置文件内容(必填)

NGINX Config:

server {

    listen xxxx proxy_protocol default_server;
    listen xxxx http2 proxy_protocol;

    access_log /var/log/nginx/access.log;
    error_log /var/log/nginx/error.log;

    location ~* \.(mp4|m4v|mkv|avi|mov|wmv|flv|webm|mpeg|mpg|ogg|3gp|m3u8|ts|m2ts|f4v)$ {
        proxy_pass http://oplist:5244;  # 源站地址(正则表达式location中不能有路径,去掉最后的斜杠)
        proxy_set_header Host wangpan.pan.net;  # 传递原始域名给源站
        proxy_set_header X-Forwarded-Proto https;  # 不传递原始协议,转为https协议
        proxy_http_version 1.1;  # 启用与后端的长连接,减少连接开销
        proxy_set_header Connection "";  # 启用与后端的长连接,减少连接开销
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Accept-Encoding "";  # 禁用压缩
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Range $http_range;
        proxy_set_header If-Range $http_if_range;
        proxy_set_header keep-alive timeout=60;
        proxy_set_header proxy-connection keep-alive;
        
        proxy_redirect off;
        client_max_body_size 100G;   # 最大上传大小100GB
        #client_body_buffer_size 20M; # 20MB 以内的文件尽量用内存
        #client_body_in_file_only off;  # 不要总是写入文件
        #client_body_temp_path /usr/local/nginx/client_temp 1 2;

        # 文件不能下载 设置超时
        # client_header_timeout 300s;
        # client_body_timeout 300s;
        keepalive_timeout 3600;
        proxy_connect_timeout 3600s;
        proxy_send_timeout 3600s;
        proxy_read_timeout 3600s;
        send_timeout 3600s;
        # 文件不能下载 设置超时结束

        # 视频文件禁用缓存
        proxy_request_buffering off;
        proxy_max_temp_file_size 0;
        proxy_buffering off;

        expires -1;
        add_header Cache-Control "no-store, no-cache, must-revalidate, max-age=0";
        add_header Pragma "no-cache";
        add_header keep-alive "timeout=60";
        add_header proxy-connection "keep-alive";

        # 建议也传递这三个头,确保后端能正确处理缓存和范围请求
        proxy_set_header If-Modified-Since $http_if_modified_since;
        proxy_set_header If-None-Match $http_if_none_match;
        proxy_ignore_headers X-Accel-Buffering;
        # 视频文件禁用缓存 结束
    }

    location / {
        proxy_pass http://oplist:5244/;  # 源站地址
        proxy_set_header Host wangpan.pan.net;  # 传递原始域名给源站
        proxy_set_header X-Forwarded-Proto https;  # 不传递原始协议,转为https协议
        proxy_http_version 1.1;  # 启用与后端的长连接,减少连接开销
        proxy_set_header Connection "";  # 启用与后端的长连接,减少连接开销
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Accept-Encoding "";  # 禁用压缩
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Range $http_range;
        proxy_set_header If-Range $http_if_range;
        # 建议也传递这两个头,确保后端能正确处理缓存和范围请求
        proxy_set_header If-Modified-Since $http_if_modified_since;
        proxy_set_header If-None-Match $http_if_none_match;
        proxy_redirect off;
        client_max_body_size 100G;   # 最大上传大小100GB
        client_body_buffer_size 20M; # 20MB 以内的文件尽量用内存
        client_body_in_file_only off;  # 不要总是写入文件
        client_body_temp_path /usr/local/nginx/client_temp 1 2;

        # 文件不能下载 设置超时
        keepalive_timeout 3600;
        proxy_connect_timeout 3600s;
        proxy_send_timeout 3600s;
        proxy_read_timeout 3600s;
        send_timeout 3600s;
        # 文件不能下载 设置超时结束

        # 文件不能下载 设置缓存
        proxy_request_buffering off;
        proxy_max_temp_file_size 0;

        proxy_buffering on; # 不影响上传速度,但应保持on以优化下载

        proxy_buffer_size 8k; # 用于存储后端响应头的初始缓冲区。上传场景中不重要,保持较小值即可。
        proxy_buffers 8 8k; # 响应体内存缓冲区。上传场景中不是关键参数,但应确保足够容纳常规响应。
        proxy_busy_buffers_size 16k; # 忙碌缓冲区大小。上传场景中不重要,但可适当增大。

        # proxy_buffer_size          128k;
        # proxy_buffers              4 256k;
        # proxy_busy_buffers_size    256k;

        proxy_temp_path /usr/local/nginx/proxy_temp 1 2;
        # proxy_max_temp_file_size 50M;
        proxy_temp_file_write_size 64k; 
        # 文件不能下载 设置缓存结束

        # 解决经常js css报错的问题:禁止浏览器缓存相关文件
        # 部分文件禁止浏览器缓存
        # if ($request_filename ~* .*\.(htm|html|json|gif|jpg|jpeg|png|bmp|swf|webp|avif|svg|js|css)$) {
        if ($request_filename ~* .*\.(htm|html|json|js|css)$) {
            # 设置缓存上面定义的后缀文件缓存到浏览器的生存时间
            # expires   3d;
            # 禁止缓存,每次都从服务器请求
            expires -1;
            add_header Cache-Control "no-store, no-cache, must-revalidate, max-age=0";
            add_header Pragma "no-cache";
        }
    }
}

docker-compose.yml:

  oplist:
    image: openlistteam/openlist:beta-aio
#    image: openlistteam/openlist:latest-aio
    container_name: oplist
    user: "1000:1000"
    volumes:
      - ./openlist:/opt/openlist/data:rw
      - ./data:/home/data:rw
    networks:
      - app_net
    environment:
      - PUID=1000
      - PGID=1000
      - UMASK=022
      - TZ=Asia/Shanghai
    restart: unless-stopped

复现链接(可选)

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions