• 请不要在回答技术问题时复制粘贴 AI 生成的内容
MuscleOf2016
0D
V2EX  ›  程序员

提个问题,麻烦大佬回答下。关于二进制视频的前端播放

  •  
  •   MuscleOf2016 · Jul 6, 2018 · 4280 views
    This topic created in 2893 days ago, the information mentioned may be changed or developed.

    现在后端给了一个一个接口,将存放的视频数据作为二进制数据 application/octet-stream 通过接口可以下载。但是只根据接口并不能知道是视频。 前端的 video 标签 也不能直接通过 src 进行播放。 有什么好的解决办法吗?还是只能改成接口返回视频文件的地址。

    9 replies    2018-07-07 01:01:08 +08:00
    MuscleOf2016
        1
    MuscleOf2016  
    OP
       Jul 6, 2018
    chrome 上倒是可以直接播放,safari 或者安卓手机上就不行了。看了下,chrome 上是对二进制做了处理。
    MzM2ODkx
        2
    MzM2ODkx  
       Jul 6, 2018   ❤️ 1
    是 responseType 设置 blob 类型,然后通过 URL.createObjectURL 转换为 blob: 开头的地址吧
    darkkylin
        3
    darkkylin  
       Jul 6, 2018   ❤️ 1
    参考下 bilbil 的播放器 flv.js 或许有用。
    tinywhale
        4
    tinywhale  
       Jul 6, 2018   ❤️ 1
    视频...这也太广泛了 mp4? ts/hls? webm? rtmp/flv? mjpeg!? 写个检测器看下文件开头,比如 mp4 开头有 ftyp isom。或者让后端改接口。
    wdlth
        5
    wdlth  
       Jul 6, 2018   ❤️ 1
    如果是 MP4 这种浏览器支持的编码,是可以通过 MSE 进行播放的,参考 hls.js 、flv.js ,对于浏览器不支持的编码,要么就调用播放器,要么就转换。
    wdlth
        6
    wdlth  
       Jul 6, 2018   ❤️ 1
    应该是 H.264 编码
    MuscleOf2016
        7
    MuscleOf2016  
    OP
       Jul 6, 2018
    @wdlth 通过接口下载的二进制文件是没有后缀的,加了 mp4 的后缀后下载的文件就能播放了。 不知道有什么不改后端的方式能处理。
    wdlth
        8
    wdlth  
       Jul 6, 2018
    @MuscleOf2016 video 标签可以指定类型的,加 type="video/mp4",或者你可以让后端加上 Content-Type 头。
    MuscleOf2016
        9
    MuscleOf2016  
    OP
       Jul 7, 2018
    @wdlth video 指定了 mp4 在 chrome 上可以,换到安卓浏览器,safari 上就凉了。Content-Type 现在是 application/octet-stream,换成 video/mpeg4 的我不确定,试试。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   922 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 41ms · UTC 19:00 · PVG 03:00 · LAX 12:00 · JFK 15:00
    ♥ Do have faith in what you're doing.