search

kiwix / kiwix-apple

Kiwix for iOS & macOS
https://apple.kiwix.org
GNU Lesser General Public License v3.0
481 stars 70 forks source link

Videos not playing on macOS #489

Closed Popolechien closed 4 months ago

Popolechien commented 1 year ago

Tested with canadian_prepper_en_surviving-disaster_2023-01 (and others): trying to read a video leads to neverending seek circle. Capture d’écran 2023-02-27 à 11 17 11

kelson42 commented 1 year ago

@Popolechien on which system? iOS?

Popolechien commented 1 year ago

macOS Ventura 13.2.1 / Kiwix-Apple 3.0 (107)

rgaudin commented 1 year ago

I am also affected ; using a different ZIM (latest mali)

kelson42 commented 1 year ago

Works on ios, i habe tested. This seems to be a macOS specific problem.

automactic commented 1 year ago

So I have looked into this. The request pattern made by the web view when loading up one of these zim files are very different. And this is more likely a file issue than an app issue. Below are request logs, when loading main page of mali-pour-les-nuls_fr_all_2023-03.zim.

On iPhone:

Request -- URL:/home.html Header-Range:nil
Request -- URL:/assets/chosen/chosen.min.css Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-support.js Header-Range:nil
Request -- URL:/assets/ogvjs/ogv.js Header-Range:nil
Request -- URL:/assets/videojs-ogvjs.js Header-Range:nil
Request -- URL:/assets/webp-hero.bundle.js Header-Range:nil
Request -- URL:/assets/jquery.min.js Header-Range:nil
Request -- URL:/assets/chosen/chosen.jquery.js Header-Range:nil
Request -- URL:/profile.jpg Header-Range:nil
Request -- URL:/assets/data.js Header-Range:nil
Request -- URL:/assets/app.js Header-Range:nil
Request -- URL:/assets/db.js Header-Range:nil
Request -- URL:/assets/videojs/video-js.min.css Header-Range:nil
Request -- URL:/assets/home.css Header-Range:nil
Request -- URL:/assets/videojs/video.min.js Header-Range:nil
Request -- URL:/assets/polyfills.js Header-Range:nil
Request -- URL:/assets/webp-trigger.js Header-Range:nil
Request -- URL:/videos/qbO7_ivMldc/video.webp Header-Range:nil
Request -- URL:/banner.jpg Header-Range:nil
Request -- URL:/videos/_f3DnpvpsUM/video.webp Header-Range:nil
Request -- URL:/videos/rIrF9TSbPis/video.webp Header-Range:nil
Request -- URL:/videos/Y1W67I0Gp8Y/video.webp Header-Range:nil
Request -- URL:/videos/p1TXZDTtOOE/video.webp Header-Range:nil
Request -- URL:/videos/yCZoYfNNbQk/video.webp Header-Range:nil
Request -- URL:/videos/vkPj7y7KacY/video.webp Header-Range:nil
Request -- URL:/videos/BupG57U82NI/video.webp Header-Range:nil
Request -- URL:/videos/qbO7_ivMldc/video.webp Header-Range:nil
Request -- URL:/assets/font/Roboto-Light.ttf Header-Range:nil
Request -- URL:/assets/font/Roboto-Bold.ttf Header-Range:nil
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-1048575
Request -- URL:/assets/ogvjs/ogv-demuxer-webm-wasm.js Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-demuxer-webm-wasm.wasm Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-demuxer-webm-wasm.wasm Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-worker-audio.js Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-decoder-audio-vorbis-wasm.js Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-decoder-audio-vorbis-wasm.wasm Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-decoder-audio-vorbis-wasm.wasm Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-worker-video.js Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-decoder-video-vp8-wasm.js Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-decoder-video-vp8-wasm.wasm Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-decoder-video-vp8-wasm.wasm Header-Range:nil

On Mac: 

Request -- URL:/home.html Header-Range:nil
Request -- URL:/assets/chosen/chosen.min.css Header-Range:nil
Request -- URL:/assets/ogvjs/ogv-support.js Header-Range:nil
Request -- URL:/assets/videojs-ogvjs.js Header-Range:nil
Request -- URL:/profile.jpg Header-Range:nil
Request -- URL:/assets/ogvjs/ogv.js Header-Range:nil
Request -- URL:/assets/chosen/chosen.jquery.js Header-Range:nil
Request -- URL:/assets/jquery.min.js Header-Range:nil
Request -- URL:/assets/db.js Header-Range:nil
Request -- URL:/assets/app.js Header-Range:nil
Request -- URL:/assets/data.js Header-Range:nil
Request -- URL:/assets/webp-hero.bundle.js Header-Range:nil
Request -- URL:/assets/videojs/video-js.min.css Header-Range:nil
Request -- URL:/assets/polyfills.js Header-Range:nil
Request -- URL:/assets/home.css Header-Range:nil
Request -- URL:/assets/videojs/video.min.js Header-Range:nil
Request -- URL:/assets/webp-trigger.js Header-Range:nil
Request -- URL:/videos/qbO7_ivMldc/video.webp Header-Range:nil
Request -- URL:/banner.jpg Header-Range:nil
Request -- URL:/videos/yCZoYfNNbQk/video.webp Header-Range:nil
Request -- URL:/videos/_f3DnpvpsUM/video.webp Header-Range:nil
Request -- URL:/videos/Y1W67I0Gp8Y/video.webp Header-Range:nil
Request -- URL:/videos/vkPj7y7KacY/video.webp Header-Range:nil
Request -- URL:/videos/p1TXZDTtOOE/video.webp Header-Range:nil
Request -- URL:/videos/BupG57U82NI/video.webp Header-Range:nil
Request -- URL:/videos/rIrF9TSbPis/video.webp Header-Range:nil
Request -- URL:/videos/qbO7_ivMldc/video.webp Header-Range:nil
Request -- URL:/assets/font/Roboto-Bold.ttf Header-Range:nil
Request -- URL:/assets/font/Roboto-Light.ttf Header-Range:nil
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-7
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-0
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=1-1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=2-2
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=3-3
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=4-4
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=5-5
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=6-6
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=7-7
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=8-8
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=9-9
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=10-10
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=11-11
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=12-12
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=13-13
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=14-14
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=15-15
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=16-16
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=17-17
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=18-18
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=19-19
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=20-20
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=21-21
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=22-22
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=23-23
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=24-24
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=25-25
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=26-26
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=27-27
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=28-28
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=29-29
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=30-30
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=31-34
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=35-35
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=36-36
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=37-37
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=38-38
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=39-39
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=40-40
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=41-41
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=42-42
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=43-43
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=44-44
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=45-45
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=46-46
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=47-47
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=48-48
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=49-49
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=50-50
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=51-51
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=52-52
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=53-53
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=54-54
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=55-55
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=56-56
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=57-57
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=58-58
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=59-59
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=60-60
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=122-122
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=123-123
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=124-124
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=125-125
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=126-126
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=127-127
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=128-128
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=129-129
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=130-130
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=284-284
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=285-285
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=286-286
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=287-287
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=288-288
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=289-289
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=290-290
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=291-291
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=292-292
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=293-293
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=294-294
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=295-295
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=296-296
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=297-297
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=298-298
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=299-299
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=300-300

And this would continue on to 301, 302, ... If you look at activity manager, you'll see kiwix.app has 100% utilization on one core.

automactic commented 1 year ago

It is true that the current released version of Kiwix (v3.0) does not support HTTP 206 response. But even if I implemented HTTP 206 response, with the correct response header & body (#496), I still get insane one byte by one byte requests:

Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-1
Response -- Header-Content-Range:bytes 0-1/30913494 BodyLength:2
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-7
Response -- Header-Content-Range:bytes 0-7/30913494 BodyLength:8
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=0-0
Response -- Header-Content-Range:bytes 0-0/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=1-1
Response -- Header-Content-Range:bytes 1-1/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=2-2
Response -- Header-Content-Range:bytes 2-2/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=3-3
Response -- Header-Content-Range:bytes 3-3/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=4-4
Response -- Header-Content-Range:bytes 4-4/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=5-5
Response -- Header-Content-Range:bytes 5-5/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=6-6
Response -- Header-Content-Range:bytes 6-6/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=7-7
Response -- Header-Content-Range:bytes 7-7/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=8-8
Response -- Header-Content-Range:bytes 8-8/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=9-9
Response -- Header-Content-Range:bytes 9-9/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=10-10
Response -- Header-Content-Range:bytes 10-10/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=11-11
Response -- Header-Content-Range:bytes 11-11/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=12-12
Response -- Header-Content-Range:bytes 12-12/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=13-13
Response -- Header-Content-Range:bytes 13-13/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=14-14
Response -- Header-Content-Range:bytes 14-14/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=15-15
Response -- Header-Content-Range:bytes 15-15/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=16-16
Response -- Header-Content-Range:bytes 16-16/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=17-17
Response -- Header-Content-Range:bytes 17-17/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=18-18
Response -- Header-Content-Range:bytes 18-18/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=19-19
Response -- Header-Content-Range:bytes 19-19/30913494 BodyLength:1
Request -- URL:/videos/qbO7_ivMldc/video.webm Header-Range:bytes=20-20

(and this would continue on...)

kelson42 commented 1 year ago

@automactic No sure how Kiwix here handle the request, but usually it should probably not be through HTTP, but using a custom ZIM protocol. Anyway, if I understand right is that the WebEngine request a byte range (totally normal for a streaming engine) and the ZIM reader backend does not deliver it is a way the WebEngine is happy with?

And this is more likely a file issue than an app issue The file works everywhere else, even with macOS/iOS browsers, I kind of doubt about that... or do you have a clear hint? I kind of suspect that the weird behaviour you see in the log might be just because the WebEngine does not receive the proper answer so tries again.

automactic commented 1 year ago

@kelson42 The issue is the web page (i.e. the zim file) is requesting video file data one byte at a time on Mac, and this is taking forever. And even with HTTP 206 response implemented, the web page is having the same behavior

The video of course would have spinning wheel forever if the web page sends 30913494 requests sequentially to get 30913494 bytes of data.

The zim file maker, i.e. the web page producer, needs to figure out why it is asking data for one byte at a time on macOS, but asking for the first 1048575 bytes on iOS. Please refer to my first comment for comparison on page loading requests between iOS & macOS

automactic commented 1 year ago

Also just to add, it is true the current released version of the app (v3.0) does not support partial requests (i.e. requests with Range header). Currently it will send back a HTTP 200 with the whole content.

But this is not the root cause, because:

  1. on iOS the video plays, and iOS and macOS have the same code for handling requests & getting data from zim file
  2. even with partial request implemented (PR #496), the video still does not play on macOS
rgaudin commented 1 year ago

FYI just recreating the ZIM, video works for home page but not article ones. Will check and let you know. That's on Kiwix 3.1 (testflight)

rgaudin commented 1 year ago

@automactic I have no way of knowing what goes on in the app. Could you try and print the Content-Range that you're sending to make sure there's no mistake there?

Could you also test with the following ZIM files that plays videos straight from the browser? In 3.1 (113), I get the mp4 version to play with great difficulties but no luck for the webm.

test-videos.zim (436M)

I note also that in Safari this HTML (even outside ZIM) doesn't displays the controls for WebM despite recognizing it…

automactic commented 1 year ago

Here you go, first chunk of request & response header when loading main page of test-videos.zim you linked above in build 114. Note the request would continue in the same pattern seemingly forever

Request["Range"]: bytes=0-1, Response: [Content-Type: video/webm, Content-Length: 2, Content-Range: bytes 0-1/238954203]
Request["Range"]: bytes=0-1, Response: [Content-Type: video/mp4, Content-Length: 2, Content-Range: bytes 0-1/197534161]
Request["Range"]: bytes=0-7, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 0-7/197534161]
Request["Range"]: bytes=0-7, Response: [Content-Type: video/webm, Content-Length: 8, Content-Range: bytes 0-7/238954203]
Request["Range"]: bytes=24-31, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 24-31/197534161]
Request["Range"]: bytes=48-55, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 48-55/197534161]
Request["Range"]: bytes=0-0, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 0-0/238954203]
Request["Range"]: bytes=72-79, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 72-79/197534161]
Request["Range"]: bytes=1-1, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 1-1/238954203]
Request["Range"]: bytes=96-103, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 96-103/197534161]
Request["Range"]: bytes=2-2, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 2-2/238954203]
Request["Range"]: bytes=120-127, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 120-127/197534161]
Request["Range"]: bytes=3-3, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 3-3/238954203]
Request["Range"]: bytes=144-151, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 144-151/197534161]
Request["Range"]: bytes=4-4, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 4-4/238954203]
Request["Range"]: bytes=168-175, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 168-175/197534161]
Request["Range"]: bytes=5-5, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 5-5/238954203]
Request["Range"]: bytes=192-199, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 192-199/197534161]
Request["Range"]: bytes=6-6, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 6-6/238954203]
Request["Range"]: bytes=216-223, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 216-223/197534161]
Request["Range"]: bytes=7-7, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 7-7/238954203]
Request["Range"]: bytes=240-247, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 240-247/197534161]
Request["Range"]: bytes=169482786-169482786, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482786-169482786/238954203]
Request["Range"]: bytes=264-271, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 264-271/197534161]
Request["Range"]: bytes=169482787-169482787, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482787-169482787/238954203]
Request["Range"]: bytes=288-295, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 288-295/197534161]
Request["Range"]: bytes=169482788-169482788, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482788-169482788/238954203]
Request["Range"]: bytes=312-319, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 312-319/197534161]
Request["Range"]: bytes=169482789-169482789, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482789-169482789/238954203]
Request["Range"]: bytes=336-343, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 336-343/197534161]
Request["Range"]: bytes=169482790-169482790, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482790-169482790/238954203]
Request["Range"]: bytes=360-367, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 360-367/197534161]
Request["Range"]: bytes=169482791-169482791, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482791-169482791/238954203]
Request["Range"]: bytes=384-391, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 384-391/197534161]
Request["Range"]: bytes=169482792-169482792, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482792-169482792/238954203]
Request["Range"]: bytes=408-415, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 408-415/197534161]
Request["Range"]: bytes=169482793-169482793, Response: [Content-Type: video/webm, Content-Length: 1, Content-Range: bytes 169482793-169482793/238954203]
Request["Range"]: bytes=432-439, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 432-439/197534161]
Request["Range"]: bytes=456-463, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 456-463/197534161]
Request["Range"]: bytes=480-487, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 480-487/197534161]
Request["Range"]: bytes=504-511, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 504-511/197534161]
Request["Range"]: bytes=528-535, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 528-535/197534161]
Request["Range"]: bytes=552-559, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 552-559/197534161]
Request["Range"]: bytes=576-583, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 576-583/197534161]
Request["Range"]: bytes=600-607, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 600-607/197534161]
Request["Range"]: bytes=624-631, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 624-631/197534161]
Request["Range"]: bytes=648-655, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 648-655/197534161]
Request["Range"]: bytes=672-679, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 672-679/197534161]
Request["Range"]: bytes=696-703, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 696-703/197534161]
Request["Range"]: bytes=720-727, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 720-727/197534161]
Request["Range"]: bytes=744-751, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 744-751/197534161]
Request["Range"]: bytes=768-775, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 768-775/197534161]
Request["Range"]: bytes=792-799, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 792-799/197534161]
Request["Range"]: bytes=816-823, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 816-823/197534161]
Request["Range"]: bytes=840-847, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 840-847/197534161]
Request["Range"]: bytes=864-871, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 864-871/197534161]
Request["Range"]: bytes=888-895, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 888-895/197534161]
Request["Range"]: bytes=912-919, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 912-919/197534161]
Request["Range"]: bytes=936-943, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 936-943/197534161]
Request["Range"]: bytes=960-967, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 960-967/197534161]
Request["Range"]: bytes=984-991, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 984-991/197534161]
Request["Range"]: bytes=1008-1015, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1008-1015/197534161]
Request["Range"]: bytes=1032-1039, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1032-1039/197534161]
Request["Range"]: bytes=1056-1063, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1056-1063/197534161]
Request["Range"]: bytes=1080-1087, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1080-1087/197534161]
Request["Range"]: bytes=1104-1111, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1104-1111/197534161]
Request["Range"]: bytes=1128-1135, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1128-1135/197534161]
Request["Range"]: bytes=1152-1159, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1152-1159/197534161]
Request["Range"]: bytes=1176-1183, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1176-1183/197534161]
Request["Range"]: bytes=1200-1207, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1200-1207/197534161]
Request["Range"]: bytes=1224-1231, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1224-1231/197534161]
Request["Range"]: bytes=1248-1255, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1248-1255/197534161]
Request["Range"]: bytes=1272-1279, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1272-1279/197534161]
Request["Range"]: bytes=1296-1303, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1296-1303/197534161]
Request["Range"]: bytes=1320-1327, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1320-1327/197534161]
Request["Range"]: bytes=1344-1351, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1344-1351/197534161]
Request["Range"]: bytes=1368-1375, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1368-1375/197534161]
Request["Range"]: bytes=1392-1399, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1392-1399/197534161]
Request["Range"]: bytes=1416-1423, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1416-1423/197534161]
Request["Range"]: bytes=1440-1447, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1440-1447/197534161]
Request["Range"]: bytes=1464-1471, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1464-1471/197534161]
Request["Range"]: bytes=1488-1495, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1488-1495/197534161]
Request["Range"]: bytes=1512-1519, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1512-1519/197534161]
Request["Range"]: bytes=1536-1543, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1536-1543/197534161]
Request["Range"]: bytes=1560-1567, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1560-1567/197534161]
Request["Range"]: bytes=1584-1591, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1584-1591/197534161]
Request["Range"]: bytes=1608-1615, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1608-1615/197534161]
Request["Range"]: bytes=1632-1639, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1632-1639/197534161]
Request["Range"]: bytes=1656-1663, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1656-1663/197534161]
Request["Range"]: bytes=1680-1687, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1680-1687/197534161]
Request["Range"]: bytes=1704-1711, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1704-1711/197534161]
Request["Range"]: bytes=1728-1735, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1728-1735/197534161]
Request["Range"]: bytes=1752-1759, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1752-1759/197534161]
Request["Range"]: bytes=1776-1783, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1776-1783/197534161]
Request["Range"]: bytes=1800-1807, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1800-1807/197534161]
Request["Range"]: bytes=1824-1831, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1824-1831/197534161]
Request["Range"]: bytes=1848-1855, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1848-1855/197534161]
Request["Range"]: bytes=1872-1879, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1872-1879/197534161]
Request["Range"]: bytes=1896-1903, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1896-1903/197534161]
Request["Range"]: bytes=1920-1927, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1920-1927/197534161]
Request["Range"]: bytes=1944-1951, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1944-1951/197534161]
Request["Range"]: bytes=1968-1975, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1968-1975/197534161]
Request["Range"]: bytes=1992-1999, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 1992-1999/197534161]
Request["Range"]: bytes=2016-2023, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2016-2023/197534161]
Request["Range"]: bytes=2040-2047, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2040-2047/197534161]
Request["Range"]: bytes=2064-2071, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2064-2071/197534161]
Request["Range"]: bytes=2088-2095, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2088-2095/197534161]
Request["Range"]: bytes=2112-2119, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2112-2119/197534161]
Request["Range"]: bytes=2136-2143, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2136-2143/197534161]
Request["Range"]: bytes=2160-2167, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2160-2167/197534161]
Request["Range"]: bytes=2184-2191, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2184-2191/197534161]
Request["Range"]: bytes=2208-2215, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2208-2215/197534161]
Request["Range"]: bytes=2232-2239, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2232-2239/197534161]
Request["Range"]: bytes=2256-2263, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2256-2263/197534161]
Request["Range"]: bytes=2280-2287, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2280-2287/197534161]
Request["Range"]: bytes=2304-2311, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2304-2311/197534161]
Request["Range"]: bytes=2328-2335, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2328-2335/197534161]
Request["Range"]: bytes=2352-2359, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2352-2359/197534161]
Request["Range"]: bytes=2376-2383, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2376-2383/197534161]
Request["Range"]: bytes=2400-2407, Response: [Content-Type: video/mp4, Content-Length: 8, Content-Range: bytes 2400-2407/197534161]
......
rgaudin commented 1 year ago

Thank you! We can now at least eliminate any player/code interference since it happens on vanilla video element.

We'll have to look for an issue/usage in WKWebView since it (mostly) works on Safari.

kelson42 commented 1 year ago

Maybe checking the payload (md5sum and compare with kiwix-serve) would be a good idea as well.

automactic commented 1 year ago

Is the page using plain html video tag with src? If yes, then there is probably nothing we can do right now. The issue is on apple's side

Also I found this, maybe useful: https://bugs.webkit.org/show_bug.cgi?id=232076

kelson42 commented 1 year ago

Is the page using plain html video tag with src? If yes, then there is probably nothing we can do right now. The issue is on apple's side

Yes: <video src="video.webm"></video>. This is something which is easy to check with kiwix-serve or zimdump.

automactic commented 1 year ago

I am gonna merge #496 regarding implementing HTTP 206 response for now. It doesn't actually fix this issue, because it may need new OS/SDK updates from apple

kelson42 commented 10 months ago

We should update this ticket. Does it works again?

kelson42 commented 10 months ago

Actually with the latest nightly on macOS12 the situation is even worse: it makes my Kiwix to crash!

michael-garofalo commented 9 months ago

Hi! 🙋🏻‍♂️

I was working on another video about Kiwix when I noticed that the Mac App didn't play videos. How am I going to watch Canadian Prepper videos in an emergency? 😄

Anyway, I was looking around in the code, as I've worked with WebViews before. It seems that this app is using a WebView. (There's literally a WebView.swift file.) So perhaps the matter is something of a security issue? I haven't worked with Xcode in a while, but that's usually why things would break. Apple would make things more restrictive.

So, what about adding this…

wc.mediaTypesRequiringUserActionForPlayback = []

…where wc is short for WKWebViewConfiguration()

I'm not sure if that will fix the problem, but since the video is just failing to load, perhaps it's being blocked?

https://developer.apple.com/documentation/webkit/wkwebviewconfiguration/1851524-mediatypesrequiringuseractionfor

BPerlakiH commented 4 months ago

@kelson42 This should also work after #764 .

michael-garofalo commented 3 months ago

I just tested this out with the new version (3.4.0) of Kiwix, which was announced here… https://kiwix.org/en/kiwix-for-apple-devices-update-3-4-0/

I downloaded the “canadian_prepper_bugoutroll_en_2024-03.zim” file. (It was the smallest download, but still pretty big) The videos played… no circle loading problem. 🙂

However, the audio did not play. 🤔

benoit74 commented 3 months ago

Unfortunately the canadian_prepper_bugoutroll_en_2024-03.zim ZIM is too old, it contains other flaws which prevent audio from working on iOS / Mac / Safari.

We are currently rebuilding all ZIMs with updated encoder settings which will solve this audio problem. This is fixed in youtube scraper 2.3.1

There is now a new version 2024-07 of the canadian_prepper_bugoutroll ZIM. For a given ZIM, you can check scraper with this kind of magic URL: https://library.kiwix.org/raw/canadian_prepper_bugoutroll_en_2024-07/meta/Scraper (just replace canadian_prepper_bugoutroll_en_2024-07 with your ZIM name.