
Recherche avancée
Médias (3)
-
MediaSPIP Simple : futur thème graphique par défaut ?
26 septembre 2013, par
Mis à jour : Octobre 2013
Langue : français
Type : Video
-
GetID3 - Bloc informations de fichiers
9 avril 2013, par
Mis à jour : Mai 2013
Langue : français
Type : Image
-
GetID3 - Boutons supplémentaires
9 avril 2013, par
Mis à jour : Avril 2013
Langue : français
Type : Image
Autres articles (41)
-
Les autorisations surchargées par les plugins
27 avril 2010, parMediaspip core
autoriser_auteur_modifier() afin que les visiteurs soient capables de modifier leurs informations sur la page d’auteurs -
HTML5 audio and video support
13 avril 2011, parMediaSPIP uses HTML5 video and audio tags to play multimedia files, taking advantage of the latest W3C innovations supported by modern browsers.
The MediaSPIP player used has been created specifically for MediaSPIP and can be easily adapted to fit in with a specific theme.
For older browsers the Flowplayer flash fallback is used.
MediaSPIP allows for media playback on major mobile platforms with the above (...) -
Support audio et vidéo HTML5
10 avril 2011MediaSPIP utilise les balises HTML5 video et audio pour la lecture de documents multimedia en profitant des dernières innovations du W3C supportées par les navigateurs modernes.
Pour les navigateurs plus anciens, le lecteur flash Flowplayer est utilisé.
Le lecteur HTML5 utilisé a été spécifiquement créé pour MediaSPIP : il est complètement modifiable graphiquement pour correspondre à un thème choisi.
Ces technologies permettent de distribuer vidéo et son à la fois sur des ordinateurs conventionnels (...)
Sur d’autres sites (9912)
-
Safari sends excessive HTTP range requests during HTML5 MOV playback
28 mai, par LucyI am currently developing a web application based on React and Next.js, and I use the react-player library to play user-uploaded videos stored on AWS S3. The supported upload video formats are mp4, mov, and mkv, with codecs including H.264 or H.265 (HEVC).


Problem


However, some
H.264
videos in themov
format exhibit noticeably poor playback performance only in the Safari browser. The videos do not play smoothly and frequently experience stuttering or delays.

How Safari Handles Range Requests (As I Understand It) :


- 

- Safari first sends a normal GET request to check if the server supports Range requests. If the server responds with the header Accept-Ranges : bytes, Safari closes the connection.
- Then, Safari sends a very small range request like Range : bytes=0-1 to confirm it receives a 206 Partial Content response.
- Next, Safari requests some parts from the beginning and the end of the file to locate metadata such as the moov atom in MP4 files.
- After that, actual streaming begins, but Safari does not request the entire file at once ; instead, it divides the needed parts into multiple small Range requests.










Example of Actual Problematic Requests


Below are some of the Range requests Safari makes for the problematic
.mov
video (H.264 codec) :

# Request - 1
Connection: keep-alive
Range: bytes=0-1

# Response
HTTP/1.1 206 Partial Content
Accept-Ranges: bytes
Content-Disposition: attachment;filename*=utf-8''test.mov
Content-Length: 2
Content-Range: bytes 0-1/102801747
Content-Type: video/quicktime

-------------------------------------
# Request - 2
Connection: Keep-Alive
Range: bytes=0-102801746

# Response
HTTP/1.1 206 Partial Content
Accept-Ranges: bytes
Content-Disposition: attachment;filename*=utf-8''test.mov
Content-Length: 102801747
Content-Range: bytes 0-102801746/102801747
Content-Type: video/quicktime

-------------------------------------
# Request - 3
Connection: Keep-Alive
Range: bytes=102760448-102801746

# Response - 3
HTTP/1.1 206 Partial Content
Accept-Ranges: bytes
Content-Disposition: attachment;filename*=utf-8''test.mov
Content-Length: 41299
Content-Range: bytes 102760448-102801746/102801747
Content-Type: video/quicktime

-------------------------------------
# Request - 4
Connection: keep-alive
Range: bytes=3014656-3080191 # 64KB

# Response - 4
HTTP/1.1 206 Partial Content
Accept-Ranges: bytes
Content-Disposition: attachment;filename*=utf-8''IMG_7929.mov
Content-Length: 65536
Content-Range: bytes 3014656-3080191/102801747
Content-Type: video/quicktime



Safari continues to send hundreds of similar small Range requests repeatedly, gradually downloading the file.


This causes increased network load, which ultimately leads to video stuttering or playback delays.


Example of another
.mov
file that works properly :

In contrast, another .mov video using the same format and codec (H.264) sends Range requests over much larger byte ranges, downloading about 30MB of data at once. In this case, the video plays smoothly.


# Request 
Connection: Keep-Alive
Range: bytes=1310534-673918954 # Request : 672MB, Actual Downloaded : 32MB

# Response
Accept-Ranges: bytes
Content-Disposition: attachment;filename*=utf-8''mov-example-video-download-4k-uhd-3840x2160.mov
Content-Length: 672608421
Content-Range: bytes 1310534-673918954/673918955
Content-Type: video/quicktime



Question


In Safari, for certain video files, the browser repeatedly closes the connection after receiving only a few kilobytes per request and immediately sends the next request. As a result, dozens or even hundreds of small range requests occur consecutively. This causes increased connection overhead and latency, and although the web server can deliver data at sufficient speed, the player does not receive data in time, leading to poor and stuttering video playback.


- 

- What could be the reason Safari repeatedly makes these very small requests for certain files ?
- Could the internal structure of the video file (such as the moov atom) influence this request pattern ?






f you have any similar experience or advice, please share.


What I'ved tried


- 

- Using
ffmpeg
to move themoov atom
to the beginning of the file with-movflags faststart
does not resolve the issue — the same problem persists. - Converting the exact same video to MP4 format and testing it results in normal playback without issues.






Test Environment


- 

- Macbook pro 16
- mac OS - Sequoia 15.5
- Safari - Latest








File information


Due to company policy, I am unable to share the problematic video files directly. However, I am attaching the file information obtained via ffprobe for your reference.


ffprobe -v error -show_format -show_streams -print_format json test.mov

{
 "streams": [
 {
 "index": 0,
 "codec_name": "h264",
 "codec_long_name": "H.264 / AVC / MPEG-4 AVC / MPEG-4 part 10",
 "profile": "High",
 "codec_type": "video",
 "codec_tag_string": "avc1",
 "codec_tag": "0x31637661",
 "width": 3840,
 "height": 2160,
 "coded_width": 3840,
 "coded_height": 2160,
 "closed_captions": 0,
 "film_grain": 0,
 "has_b_frames": 0,
 "pix_fmt": "yuv420p",
 "level": 51,
 "color_range": "tv",
 "color_space": "bt709",
 "color_transfer": "bt709",
 "color_primaries": "bt709",
 "chroma_location": "left",
 "field_order": "progressive",
 "refs": 1,
 "is_avc": "true",
 "nal_length_size": "4",
 "id": "0x1",
 "r_frame_rate": "30000/1001",
 "avg_frame_rate": "18200/607",
 "time_base": "1/600",
 "start_pts": 0,
 "start_time": "0.000000",
 "duration_ts": 10925,
 "duration": "18.208333",
 "bit_rate": "44900923",
 "bits_per_raw_sample": "8",
 "nb_frames": "546",
 "extradata_size": 158,
 "disposition": {
 "default": 1,
 "dub": 0,
 "original": 0,
 "comment": 0,
 "lyrics": 0,
 "karaoke": 0,
 "forced": 0,
 "hearing_impaired": 0,
 "visual_impaired": 0,
 "clean_effects": 0,
 "attached_pic": 0,
 "timed_thumbnails": 0,
 "non_diegetic": 0,
 "captions": 0,
 "descriptions": 0,
 "metadata": 0,
 "dependent": 0,
 "still_image": 0,
 "multilayer": 0
 },
 "tags": {
 "creation_time": "",
 "language": "und",
 "handler_name": "Core Media Video",
 "vendor_id": "[0][0][0][0]",
 "encoder": "H.264"
 }
 },
 {
 "index": 1,
 "codec_name": "aac",
 "codec_long_name": "AAC (Advanced Audio Coding)",
 "profile": "LC",
 "codec_type": "audio",
 "codec_tag_string": "mp4a",
 "codec_tag": "0x6134706d",
 "sample_fmt": "fltp",
 "sample_rate": "44100",
 "channels": 2,
 "channel_layout": "stereo",
 "bits_per_sample": 0,
 "initial_padding": 0,
 "id": "0x2",
 "r_frame_rate": "0/0",
 "avg_frame_rate": "0/0",
 "time_base": "1/44100",
 "start_pts": 0,
 "start_time": "0.000000",
 "duration_ts": 802988,
 "duration": "18.208345",
 "bit_rate": "187218",
 "nb_frames": "787",
 "extradata_size": 2,
 "disposition": {
 "default": 1,
 "dub": 0,
 "original": 0,
 "comment": 0,
 "lyrics": 0,
 "karaoke": 0,
 "forced": 0,
 "hearing_impaired": 0,
 "visual_impaired": 0,
 "clean_effects": 0,
 "attached_pic": 0,
 "timed_thumbnails": 0,
 "non_diegetic": 0,
 "captions": 0,
 "descriptions": 0,
 "metadata": 0,
 "dependent": 0,
 "still_image": 0,
 "multilayer": 0
 },
 "tags": {
 "creation_time": "",
 "language": "und",
 "handler_name": "Core Media Audio",
 "vendor_id": "[0][0][0][0]"
 }
 },
 {
 "index": 2,
 "codec_type": "data",
 "codec_tag_string": "mebx",
 "codec_tag": "0x7862656d",
 "id": "0x3",
 "r_frame_rate": "0/0",
 "avg_frame_rate": "0/0",
 "time_base": "1/600",
 "start_pts": 0,
 "start_time": "0.000000",
 "duration_ts": 10925,
 "duration": "18.208333",
 "bit_rate": "4",
 "nb_frames": "1",
 "disposition": {
 "default": 1,
 "dub": 0,
 "original": 0,
 "comment": 0,
 "lyrics": 0,
 "karaoke": 0,
 "forced": 0,
 "hearing_impaired": 0,
 "visual_impaired": 0,
 "clean_effects": 0,
 "attached_pic": 0,
 "timed_thumbnails": 0,
 "non_diegetic": 0,
 "captions": 0,
 "descriptions": 0,
 "metadata": 0,
 "dependent": 0,
 "still_image": 0,
 "multilayer": 0
 },
 "tags": {
 "creation_time": "",
 "language": "und",
 "handler_name": "Core Media Metadata"
 }
 },
 {
 "index": 3,
 "codec_type": "data",
 "codec_tag_string": "mebx",
 "codec_tag": "0x7862656d",
 "id": "0x4",
 "r_frame_rate": "0/0",
 "avg_frame_rate": "0/0",
 "time_base": "1/600",
 "start_pts": 0,
 "start_time": "0.000000",
 "duration_ts": 10925,
 "duration": "18.208333",
 "bit_rate": "6756",
 "nb_frames": "80",
 "disposition": {
 "default": 1,
 "dub": 0,
 "original": 0,
 "comment": 0,
 "lyrics": 0,
 "karaoke": 0,
 "forced": 0,
 "hearing_impaired": 0,
 "visual_impaired": 0,
 "clean_effects": 0,
 "attached_pic": 0,
 "timed_thumbnails": 0,
 "non_diegetic": 0,
 "captions": 0,
 "descriptions": 0,
 "metadata": 0,
 "dependent": 0,
 "still_image": 0,
 "multilayer": 0
 },
 "tags": {
 "creation_time": "",
 "language": "und",
 "handler_name": "Core Media Metadata"
 }
 },
 {
 "index": 4,
 "codec_type": "data",
 "codec_tag_string": "mebx",
 "codec_tag": "0x7862656d",
 "id": "0x5",
 "r_frame_rate": "0/0",
 "avg_frame_rate": "0/0",
 "time_base": "1/600",
 "start_pts": 0,
 "start_time": "0.000000",
 "duration_ts": 10925,
 "duration": "18.208333",
 "bit_rate": "50764",
 "nb_frames": "546",
 "disposition": {
 "default": 1,
 "dub": 0,
 "original": 0,
 "comment": 0,
 "lyrics": 0,
 "karaoke": 0,
 "forced": 0,
 "hearing_impaired": 0,
 "visual_impaired": 0,
 "clean_effects": 0,
 "attached_pic": 0,
 "timed_thumbnails": 0,
 "non_diegetic": 0,
 "captions": 0,
 "descriptions": 0,
 "metadata": 0,
 "dependent": 0,
 "still_image": 0,
 "multilayer": 0
 },
 "tags": {
 "creation_time": "",
 "language": "und",
 "handler_name": "Core Media Metadata"
 }
 },
 {
 "index": 5,
 "codec_type": "data",
 "codec_tag_string": "mebx",
 "codec_tag": "0x7862656d",
 "id": "0x6",
 "r_frame_rate": "0/0",
 "avg_frame_rate": "0/0",
 "time_base": "1/600",
 "start_pts": 0,
 "start_time": "0.000000",
 "duration_ts": 10925,
 "duration": "18.208333",
 "bit_rate": "19",
 "nb_frames": "1",
 "disposition": {
 "default": 1,
 "dub": 0,
 "original": 0,
 "comment": 0,
 "lyrics": 0,
 "karaoke": 0,
 "forced": 0,
 "hearing_impaired": 0,
 "visual_impaired": 0,
 "clean_effects": 0,
 "attached_pic": 0,
 "timed_thumbnails": 0,
 "non_diegetic": 0,
 "captions": 0,
 "descriptions": 0,
 "metadata": 0,
 "dependent": 0,
 "still_image": 0,
 "multilayer": 0
 },
 "tags": {
 "creation_time": "",
 "language": "und",
 "handler_name": "Core Media Metadata"
 }
 }
 ],
 "format": {
 "filename": "test.mov",
 "nb_streams": 6,
 "nb_programs": 0,
 "nb_stream_groups": 0,
 "format_name": "mov,mp4,m4a,3gp,3g2,mj2",
 "format_long_name": "QuickTime / MOV",
 "start_time": "0.000000",
 "duration": "18.208345",
 "size": "102801747",
 "bit_rate": "45166871",
 "probe_score": 100,
 "tags": {
 "major_brand": "qt ",
 "minor_version": "0",
 "compatible_brands": "qt ",
 "creation_time": "",
 "com.apple.quicktime.location.accuracy.horizontal": "76.200233",
 "com.apple.quicktime.full-frame-rate-playback-intent": "0",
 "com.apple.quicktime.location.ISO6709": "",
 "com.apple.quicktime.make": "Apple",
 "com.apple.quicktime.model": "iPhone 15 Pro",
 "com.apple.quicktime.software": "18.4.1",
 "com.apple.quicktime.creationdate": ""
 }
 }
}



-
How to Track Website Visitors : Benefits, Tools and FAQs
31 août 2023, par Erin — Analytics Tips, Marketing -
Marketing Touchpoints : Examples, KPIs, and Best Practices
11 mars 2024, par Erin