11ty / eleventy-dev-server

A minimal generic web-development web server.
103 stars 19 forks source link

Byte-range requests are not in HTTP headers, so Safari can't play video files served by Eleventy Server #51

Closed NathanBowers closed 7 months ago

NathanBowers commented 1 year ago

Byte-range requests are not in HTTP headers, so Safari can't play .mp4 or .webm files served from Eleventy Server.

Here's a bit of reference:

Reproduce:

  1. Create a simple page with two video elements, one which uses remote hosted video files and one that points to video files served from localhost
  2. You can use low bandwidth video sample files from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video
  3. Sample code
    <!-- local media -->
    <video controls width="350">
    <source src="/media/flower/flower.webm" type="video/webm">
    <source src="/media/flower/flower.mp4" type="video/mp4">
    </video>
    <!-- remote media -->
    <video controls width="350">
    <source src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm" type="video/webm">
    <source src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4" type="video/mp4">
    </video>

My setup:

  1. MacOS 13.2
  2. Safari 16.3
  3. Eleventy 2.0.0-beta.3

Screenshot:

Screenshot 2023-02-02 at 6 44 16 PM

zachleat commented 7 months ago

Shipped with Dev Server v2.0.0