苹果Safari浏览器上video标签的播放问题

最近在做一个国际自驾游旅行社的官网，应boss要求，要把官网的首页做成以视频为背景的样子，大概是这样，首页的大图使用video来完成。

 但是在MAC系统上确不能播放，出现了白屏的现象。最终通过努力还是解决了这个问题。

首先写一个简单的播放视频的html代码，大概是这样：

<video autoplay loop>
    <source src="video/xxx.mp4" type="video/mp4">
    <source src="video/xxx.webm" type="video/webm">
</video>

事实上，video标签是一个视频功能，是html5标准。浏览器在实现它的时候，可能会产生一些差异。video标签的路径就是浏览器辅助发起视频请求的地址，不同的是，safari会首先去请求1字节的数据来确认这个视频是否可以播放，而其他浏览器不会。这一字节的请求是携带range请求头的，它表示请求从某某字节到某某字节（x-x 如 0-1）的数据，这就导致safari没能够拿到想要的数据，于是判定该视频无法播放。range请求头和206状态码，无疑是为断点续传预备的，说白了，如果你的后台视频服务支持断点续传（在视频服务中，快进，快退，拖动进度条，也是请求x-x字节的数据，应也是断点续传），视频就可以在safari上播放，否则就不行。当然，最最基础的，首先是浏览器支持video标签，并且支持对应的视频格式。

所以 ，解决方法如下：

在tomcat的web.xml配置文件中，增加以下配置：

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.mp4</url-pattern>
</servlet-mapping>

还有一种方法是在XXX-servlet.xml文件中使用<mvc:default-servlet-handler/>