Video tag does not work under dev mode in Safari

[onevcat]

Thanks for this project!

OS: macOS 10.13.4
node: 8.9.4
VuePress: 0.5.1
Browser: Safari 11.1
Local install
Yarn

What

Video tag html in a markdown file does not work under dev mode in Safari. However, it works in Chrome.

Reproduce

1. Create a md file mixed with video HTML tag, something like thi:

## Hello

<video src="/hello.mp4" controls="controls" />

2. Make sure there is a valid hello.mp4 file under .vuepress/public/.
3. Run vuepress dev.
4. Open this page in Safari.

Expected

The page should be rendered as an h2 title "Hello", followed by a video of "hello.mp4"

Result

The h2 "Hello" renders perfectly, but the video not. It turns to be a forbidden video frame:

Additional Information

• It only happens in Dev Mode of vuepress. The dist version from vuepress build (with a simple HTTP server for the dist folder) works perfectly.
• The rendered HTML is correct, and I could right click on the video to get the link. Copying and pasting the link to a new tab, the video does not play.
• However, I could right click on the video to download it. Downloaded video could be played in Apple QuickTime without problem. So it seems to be the file is not served correctly?
• Everything works well in Chrome even under Dev Mode. So I guess it might be a Safari issue which does not recognize the video format? I could switch to Chrome for dev purpose so it is just a trivial issue.

I also attached the video I am using:

http://docs.uniwebview.com/images/transition.mp4

[ulivz]

The issue is that safari or iOS expects chunks. which is meaning that the server should be a streaming server. If your video is from a blob or file server then safari will throw an error.

Of course, it should be an enhancement.

[ulivz]

It should be fixed at #555 at 825877c, you could see it at next release.