Tôi có trang web này:
http://healthpad.net/dashboard/
Nó có 10 <video>
yếu tố trên đó.Tại sao Safari trên iOS không hiển thị áp phích video HTML5 của tôi?
Vì một số lý do, khi tôi tải trang trên iPad, nó không hiển thị áp phích video.
Hãy thử như sau:
- tải trang trên trình duyệt máy tính để bàn
- tải nó trên một chiếc iPad hoặc iPad mô phỏng, và bạn nhận được một hộp đen lớn với một nút play
hãy cho tôi biết lý do điều này xảy ra?
Dưới đây là những gì tôi đã loại trừ khả năng:
ảnh Content-Type tiêu đề.
Tôi đã xác thực rằng tiêu đề loại nội dung hình ảnh được đặt chính xác. Trong ví dụ trên, tiêu đề Content-Type
đúng cách image/jpeg
.
nhiễu với thư viện Video.js
VideoJs được sử dụng để chứng minh rằng nút play thoải mái trên các trình duyệt máy tính để bàn và để tùy chỉnh các điều khiển. Thư viện này không can thiệp vào trình phát gốc.
Để đảm bảo, tôi đã tạo một trang video thử nghiệm không có lớp video-js, do đó thư viện không nhận và xử lý video đó. Trong thực tế, trang kiểm tra thậm chí không bao gồm bất kỳ thư viện JS, nó chỉ là
<html><body>
<video
controls
height="400"
width="600"
poster="http://healthpad.net/media/CACHE/images/uploads/video_poster_1414/bd5fba5a68ddd0f4b3f61193f6908962.jpg"
src="http://healthpad.net/media/uploads/video_processed_720p_1414.mp4"
></video>
</body></html>
http://healthpad.net/rj_templates/test/zzz/
Cách sử dụng của bất kỳ thuộc tính video mà có thể không được hỗ trợ trên Mobile Safari
Trang thử nghiệm trên chỉ có một thẻ video đơn giản. Tôi đã thử xóa mọi thuộc tính khác ngoại trừ src
và poster
, nó không giúp ích gì.
Hầu hết các câu hỏi StackOverflow về chủ đề này chỉ nói "Khởi động lại iPad của bạn"
Dưới đây là nơi nó được kỳ lạ:
Nếu bạn google xung quanh về vấn đề này, các câu trả lời trên StackOverflow có được chấp nhận thường nói "Khởi động lại iPad của bạn, điều đó đã làm cho tôi".
Vì vậy, tôi đã thử làm điều tương tự, lúc đầu tôi chỉ nói rằng nó không hoạt động trong trường hợp của tôi.
Sau đó, tôi đã cố gắng này:
(tất cả các nội dung sau vào mô phỏng iPad)
- Tới trang web, áp phích phim không hiển thị
- Tới trang kiểm tra (http://healthpad.net/rj_templates/test/zzz/) , áp phích video không hiển thị.
- Nhấp vào trang chủ để thoát khỏi Safari (hoặc phím tắt Cmd + Shift + H cho trình giả lập)
- Nhấp đúp vào nút trang chủ để chuyển công việc bên ngoài Safari, chạm và giữ biểu tượng safari cho đến khi nút giết hiển thị .
- Giết Safari
- Mở safari (khởi động lại). Tại thời điểm này, nếu bạn tải trang thử nghiệm (trang chỉ có một video), áp phích sẽ hiển thị.
- Bây giờ, hãy truy cập trang nhiều video: (http://healthpad.net/dashboard/). Áp phích video không hiển thị.
- Quay lại trang thử nghiệm một video, áp phích video cho quảng cáo đó không còn hoạt động nữa.
- Lặp lại các bước từ 3 đến 8 để xem quy trình khi áp phích video ngừng hoạt động.
Vì vậy, rõ ràng, tại một số điểm, Mobile Safari quyết định sẽ không còn hiển thị bất kỳ áp phích video nào. Ngoài ra, rõ ràng, trang web của tôi kích hoạt tình trạng này.
Làm rõ:
Khi áp phích không còn làm việc, nó không chỉ xảy ra trên một miền, không có áp phích video sẽ được nạp cho bất kỳ trang web nào khác, bất kể có hay không nó trên một tên miền hoàn toàn khác nhau (ví dụ: video giới thiệu từ http://www.videojs.com/).
Để đặt lại hành vi này, từ những gì tôi đã thấy, bạn phải giết và khởi động lại Safari. Chỉ cần đóng và mở lại nó sẽ không thiết lập lại trạng thái này.
Có ai biết tại sao điều này xảy ra không? Có cách nào để giải quyết nó không?
Vì vậy, bạn cũng thấy vấn đề với thẻ video đơn giản hoặc chỉ khi sử dụng video.js? Ngoài ra phiên bản nào của video.js và phiên bản iOS nào? – heff
Xảy ra với thẻ video đồng bằng, ngay cả khi videoj không hiển thị. – Prody