2012-01-05 36 views
6

[Xem nội dung cập nhật! - Hoạt động trên trình duyệt Android/IOS nhưng không có nơi nào khác. FireFox, Chrome, Opera, Safari đều thất bại. Mặc dù chúng chắc chắn là thẻ video HTML5 đã sẵn sàng]Thẻ video Apache + HTML5 - Điều gì có thể xảy ra?

Chỉ cần cố gắng phát trực tuyến video bằng thẻ html5. Tất cả những gì tôi nhận được là điều khiển trình phát video và không có gì khác. Điều này rất đơn giản, tôi cho rằng nó chỉ hoạt động:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Movie title</title> 
</head> 
<body> 
<video id="movie" preload controls> 
    <source src="test.mp4" /> 
</video> 
</body> 

Vậy tôi có thể làm gì sai? Tôi đã thử nhiều hơn đoạn trích nhỏ này. Tôi đã thử các đoạn mã ví dụ khác của mọi người. Tôi đã thử nhiều video, nhiều định dạng (mp4, flv, ogg). Tôi đã thử xem nó trong trình duyệt Chrome, Firefox, Android Embedded, Opera, IE9.

Tôi có thể truyền tệp từ URL trong các chương trình như VLC mà không gặp bất kỳ sự cố nào.

Tôi bắt đầu nghĩ rằng Apache2 có thể là vấn đề ở đây mặc dù tôi hình thực tế tôi có thể truyền URL từ VLC mà không có vấn đề sẽ đề nghị Apache2 không phải là vấn đề.

Bất kỳ trợ giúp nào được đánh giá cao. Tôi đang kéo tóc ở đây.

Cập nhật:

  • Bất cứ khi nào tôi cố gắng và truy cập vào URL của thư mục video từ trong Chrome có vẻ như để cho tôi lỗi này: Resource hiểu là khác nhưng chuyển với kiểu MIME không xác định

  • Lỗi đó chắc chắn là một vấn đề phía máy chủ, apache2 không được cấu hình đúng ở đâu đó?

  • Nếu tôi truy cập ngay cả thư mục tệp FLV từ URL trong máy chủ Apache2 của tôi, nó cung cấp lỗi loại MIME không xác định này. Nó kiểm soát video. Bất cứ khi nào tôi nhấp vào chơi nó sẽ spam loại MIME không xác định một vài lần.

Update2:

  • xác minh .htaccess của tôi đang được đọc

  • gia tăng như sau để .htaccess của tôi:

    AddType video/ogg .ogv

    Video AddType/ogg .ogg

    AddType video/mp4 .mp4

  • Vẫn không hoạt động, vẫn thấy LOẠI MIME được xác định trong Chrome.

UPDATE3:

  • Firefox và những người khác có thể xem các URL/test.mp4 mà không vấn đề nhưng NONE có thể nhận được thẻ video hoạt động tốt.

Update4:

  • Android có thể nhận được thẻ video để làm việc bây giờ. Thay đổi .htaccess dường như sửa lỗi đó. Tuy nhiên không phải một trình duyệt máy tính để bàn duy nhất có thể vì bất kỳ lý do gì.
+0

điều duy nhất tôi có thể thấy là thẻ HTML cuối bị thiếu và 'điều khiển tải trước' dường như không có trong thông số kỹ thuật. tức là preload có một trong ba đối số "auto | metadata | none" có vẻ như vậy. – bjarneh

+0

Tôi đã xóa lệnh tải trước, không có sự khác biệt. Có vẻ như CHROME không thể truyền trực tiếp mp4 từ URL/test.mp4. Tuy nhiên, các trình duyệt khác có thể, chẳng hạn như FireFox. Vì vậy, bây giờ tôi cảm thấy như thể tôi đang quay lại bước một, thẻ video là vấn đề. – Halsafar

+2

ok, chỉ cần sao chép thiết lập của bạn và nó hoạt động tốt trong tất cả các trình duyệt của tôi, với clip webm mà tôi đã tải xuống từ: http://camendesign.com/code/video_for_everybody/test.html. cài đặt apache của tôi là vani, được cài đặt thông qua apt-get, không bao giờ sửa đổi các tệp cấu hình chung, không có .htaccess bên trong 'public_html' và cứ thế. tôi đã thêm 'controls =" controls "' vào thẻ video. – bjarneh

Trả lời

3

Firefox và Opera không hỗ trợ MP4 và Chrome sẽ sớm hỗ trợ tính năng này. Bạn cũng nên thêm một nguồn WebM.

Hãy thử thêm các thuộc tính type đến việc khai source:

<source src="test.mp4" type="video/mp4"> 
+0

Mặc dù việc thêm loại không thay đổi bất cứ điều gì. Chuyển đổi sang WEBM với ffmpeg dường như sửa mọi thứ. Chrome, Opera, Firefox có thể xem nó hoàn hảo ngay bây giờ. Tuy nhiên trình duyệt Android dường như không hoạt động với WEBM. Vì vậy, tôi đã thêm hai thẻ nguồn một với webm và một với mp4. Điều này dường như sửa chữa nó. Thật không may là tôi sẽ phải giữ hai bản sao của mỗi video. Dù sao xung quanh điều này? – Halsafar

+0

Tôi không sợ, và bạn có thể đổ lỗi cho một số công ty vì họ không đồng ý với định dạng video mà tất cả họ đều ủng hộ. Orginally đặc tả HTML5 đã hỗ trợ OGG (cho âm thanh và video) bắt buộc, nhưng Apple và Nokia phàn nàn, vì vậy nó đã bị loại bỏ. Bạn cũng sẽ vẫn cần MP4 cho Safari và IE9. –

0

Đây là mã html của tôi từ trang web của tôi www.pi-corp.net. Điều này cho phép phát lại trên tất cả các trình duyệt thương mại với dự phòng để flash.

<div class="video-js-box" style="width: 316px"><br><video class="video-js" width="320" height="240" controls preload autoplay poster="http://pi-corp.net/images/PIC_Full_Logo_PIC_HMI.png"><source src="http://pi-corp.net/picvideo/PIChmi.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /><source src="http://pi-corp.net/picvideo/PIChmi.ogv" type='video/ogg; codecs="theora, vorbis"' /><source src="http://pi-corp.net/picvideo/PIChmi.webm" type='video/webm; codecs="vp8, vorbis"' /> 
     <object id="flash_fallback_1" class="vjs-flash-fallback" width="320" height="240" type="application/x-shockwave-flash" 
     data="flowplayer-3.2.1.swf"><div class="style23"> <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" /><param name="allowfullscreen" value="true" /><param name="flashvars" value='config={"playlist":["http://pi-corp.net/images/PIC_Full_Logo_PIC_HMI.png", {"url":"http://pi-corp.net/picvideo/PIChmi.mp4 
     ","autoPlay":true,"autoBuffering":true}]}' /> <img src="http://pi-corp.net/images/PIC_no_playback.png" width="320" height="240" alt="Poster Image" 
      title="No video playback capabilities." /> </div> </object></video> 
Các vấn đề liên quan