Safari无法播放Ubuntu服务器H.264视频及Django项目视频播放求助
Hey there, let's tackle this Safari MP4 playback issue you're facing in your Django project. I've run into similar quirks with older Safari versions before, so let's break down the most likely fixes step by step:
Safari is notoriously picky about proper HTTP headers when it comes to video playback—especially partial content support, which it needs to start playing and handle seeking. Here are the critical headers to verify:
Accept-Ranges: bytes: Safari requires this to support partial requests (if missing, it'll refuse to load the video)Content-Length: Must match the actual file size exactlyContent-Type: Needs to be explicitly set tovideo/mp4(generic types likeapplication/octet-streamwon't work)
To check these, open Safari's Web Inspector (go to Develop > Show Web Inspector, switch to the Network tab, then reload your video page and click on the video file request). If any of these headers are missing or incorrect, you'll need to fix how Django serves your media files.
For local development, Django's built-in runserver often drops these headers for large files. Consider using a proper server like nginx even for testing, or add a custom middleware to inject the required headers.
Just because a file is MP4 doesn't mean it's compatible with older Safari versions. Safari 10.1.2 relies on QuickTime under the hood, which has strict codec rules:
- Video must use H.264, specifically Baseline, Main, or High Profile (avoid newer profiles like High 10-bit)
- H.264 Level should be 4.1 or lower (higher levels aren't supported in older Safari builds)
- Audio must be AAC-LC (Low Complexity) — other AAC variants or MP3 won't work
You can check your file's specs with ffprobe (part of FFmpeg) using this command:
ffprobe -v error -show_entries stream=codec_name,profile,level -of default=noprint_wrappers=1 your_video.mp4
Compare this to the working MP4 from the quirksmode test page—their file almost certainly meets these parameters. If yours doesn't, re-encode it with FFmpeg using compatible settings:
ffmpeg -i input.mp4 -c:v libx264 -profile:v main -level 4.1 -c:a aac -b:a 128k output_safari_compatible.mp4
If you're serving media files directly via Django (especially in production), this is likely part of the problem:
- In your
settings.py, confirmMEDIA_URLandMEDIA_ROOTare correctly configured - Never use Django's
runserverfor media in production—it's not built to handle proper streaming headers. Use a reverse proxy like nginx instead, which will automatically handle the required headers for video files. - For local dev, if you need to stick with Django, try using a package like
django-sendfilewhich properly supports partial content requests.
You mentioned ClickToFlash didn't help, but try disabling it entirely temporarily to make sure it's not blocking playback. Also, even though Safari 10.1.2 is older, check if QuickTime has any available updates—sometimes codec fixes are pushed separately.
Another quick check: Make sure your video URLs end with .mp4. Safari sometimes blocks videos that don't have a clear file extension, especially if you're serving them via a Django view without the extension in the URL.
Try opening your MP4 file directly in Safari by pasting its full URL (e.g., http://your-project-url/media/videos/your-video.mp4). If it still doesn't play, the issue is with the file itself or how it's served, not your HTML5 video tag. If it does play, double-check your video markup to ensure it includes the controls attribute and explicitly sets the MIME type in the source tag:
<video controls width="600"> <source src="{{ video.media_url }}" type="video/mp4"> Your browser does not support the video tag. </video>
内容的提问来源于stack exchange,提问作者escapee

