iOS 4.2.1 Mobile Safari не показывает изображение постера

Question

Я работал над сайтом для iPad, который использует HTML5-видео, и хотя у меня работает воспроизведение видео, я не могу на всю жизнь заставить изображение плаката появиться. Это выглядит хорошо на рабочем столе Safari. Вот код:

<video src="video/about_the_man.mp4" controls height=360 width=480  poster="video/posters/about_the_man.jpg"></video>

Я использую эту ссылку в качестве ссылки (листинг 1.2): https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html#//apple_ref/doc/uid/TP40009523-CH2-SW6

В нем говорится, что на iOS изображение плаката будет отображаться до тех пор, пока пользователь не начнет воспроизведение, но сейчас все, что я получаю, - это черный экран размером с видео с большой кнопкой воспроизведения в центре. Я смотрел на другие публикации на этом топе ( здесь и здесь ), но ни одно из решений не помогло мне. Единственное, что немного необычно для сайта - это то, что элемент видео находится во встроенном лайтбоксе, поэтому изначально при загрузке страницы его не видно, но я не знаю, почему это будет иметь значение.

Answer 1

У меня была точно такая же проблема.Я решил попробовать свой код на других iPad, и он работал нормально.Появилось изображение плаката.

После того, как я немного почесал голову, решение было сделать полную перезагрузку iPad и повторить попытку.После перезагрузки мой iPad отобразил изображение плаката, как и должно быть.

Может быть, оно будет работать для вас?

Answer 2

Я обнаружил, что существует ограничение на количество изображений, которое вы можете загрузить на iPad

Вот что он говорит:

Я недавно столкнулся с ограничением мобильного Safari при сборкеAJAX-у сайт на iPad.Если вы загрузите тонну изображений, в конечном итоге мобильный Safari отключит вас и вместо изображения отобразит [?].После некоторых тестов выясняется, что этот предел составляет около 6,5 МБ.Вот тестовая страница, которую я сделал, которая пытается загрузить 20 500kb изображений.При открытии этой страницы на iPad 7 изображений не появляются, хотя у Чарльза они возвращают 200 - успех.Я предполагаю, что это похоже на то, как автовоспроизведение отключено для тега видео на iPad / iPhone.Apple, вероятно, хочет убедиться, что пользователи не будут перегружены загрузками при просмотре в 3G.

Во всяком случае, 6,5 МБ - это огромная нагрузка и не будет хорошо работать в 3G, но по однойдругой, вы можете обойти это ограничение.Я обнаружил, что самый простой способ исправить код - это загрузить изображение в тег canvas, используя drawImage().Похоже, что тег canvas не имеет ограничений.

Вот другая тестовая страница с использованием тега canvas, все изображения должны загружаться.