2012-07-04 41 views
10

Tôi có video 1080p mà tôi đang hiển thị trong thẻ HTML5 <video> trên trang của mình.Video HTML5: Phát hiện băng thông

Có phương pháp javascript đơn giản (ish) nào để phát hiện băng thông để tôi có thể chuyển video thành phiên bản chất lượng thấp hơn nếu kết nối của người dùng quá chậm để phát trực tuyến video không? Tương tự như logic đằng sau trình chọn kích thước video 'tự động' của YouTube.

+0

Đó là một chút cũ nhưng bạn có thể muốn xem thử tốc độ [api] (http://speedof.me/api). – advncd

Trả lời

0

Tôi ghét tính năng đó! Nó thường sai, và nếu tôi muốn chờ đợi 2 giờ để tải video dang của tôi, hơn tôi chờ đợi! Không có cách nào đáng tin cậy để đo chính xác điều này mà không cần gửi một tệp giả lớn cho người dùng và đo thời gian cần để có được anh ta.

Bạn nên dựa vào đầu vào của người dùng (và ghi nhớ chính xác nó! Cũng giống như YouTube!).

Tóm lại, không coi YouTube là một ví dụ.

+0

Nhưng chắc chắn nếu tốc độ kết nối của bạn chậm trong khi phát lại, bạn sẽ muốn video tự động chuyển sang luồng băng thông thấp hơn tạm thời thay vì làm gián đoạn phát lại. Không? –

+0

@DanHerbert: Không nếu nút chuyển bị tắc nghẽn, thường là (Chất lượng của video bị suy giảm mạnh, thường gây ra bất kỳ bộ đệm nào trước đó để đi vào địa ngục, nghĩa là bạn không thể tua lại đúng cách). Không. Nếu người dùng muốn làm điều đó, anh ta sẽ tự làm, tin tôi đi. Chỉ cần làm cho tùy chọn thay đổi chất lượng hiển thị và đủ rõ ràng. Không phải mọi thứ đều phải tự động. –

3

Trong google chrome ít nhất có những thuộc tính trên phần tử video:

webkitVideoDecodedByteCount: 0 
webkitAudioDecodedByteCount: 0 

Những nên đủ để xác định nhanh như thế nào khách hàng có thể giải mã video. Khi phát video, bạn sẽ theo dõi số lượng delta của các byte này cung cấp cho bạn byte/s máy khách đang xử lý video.

+2

Bất kỳ cập nhật nào về phương pháp này hay bất kỳ phương pháp nào khác vào năm 2015? Cảm ơn –

0

Có các dịch vụ trả phí có thể cung cấp cho bạn chỉ báo băng thông của bên kia, như netspeed.

Độ chính xác của dữ liệu có thể đủ cho bạn, nhưng tôi chưa có cơ hội tự mình kiểm tra.

+0

Tôi đã xem xét netspeed ... Đó là một chỉ báo nhưng nó thực sự rất thô, nó chỉ nói "Cáp/DSL", "Dialup", "Di động", v.v. – schieferstapel

+0

Vâng, tính năng phát hiện và giám sát tốc độ đệm sẽ là thay thế tốt nhất :) –

3

Tùy thuộc vào nền tảng trình phát và nền tảng bạn đang sử dụng, bạn có thể sử dụng mã hóa HLS cho video của mình. HLS là viết tắt của HTTP Live Streaming, một giao thức được phát triển bởi Apple để chủ yếu giải quyết vấn đề này (trong số những người khác).

HLS về cơ bản sẽ chia nhỏ tệp video của bạn thành nhiều tệp nhỏ để chúng có thể được "giả" được truyền trực tuyến bằng một máy chủ Web đơn giản. Với HLS, bạn cũng có thể mã hóa ở nhiều độ phân giải và người chơi có thể chuyển sang băng thông thấp hơn hoặc cao hơn.

Nhược điểm duy nhất là hầu hết người chơi sử dụng Flash để phát nội dung được mã hóa HLS. Hãy kiểm tra trong hành động ở đây: http://www.flashls.org/latest/examples/chromeless/

Dưới đây là HLS demo cho flowplayer: http://demos.flowplayer.org/basics/hls.html

Và đây là một plugin cho VideoJS: https://github.com/videojs/videojs-contrib-hls

Để mã hóa trong HLS, bạn có thể sử dụng ffmpeg miễn phí và tải tệp lên máy chủ của bạn: https://www.ffmpeg.org/ffmpeg-formats.html#hls-1

Hoặc bạn có thể sử dụng giải pháp dựa trên đám mây như AWS Transcoder hoặc Brightcove https://aws.amazon.com/elastictranscoder/

+2

'videojs-contrib-hls':" * Dự án này giải quyết tình huống đó bằng cách cung cấp một polyfill cho HLS trên các trình duyệt có hỗ trợ cho Media Source Extensions, hoặc không hỗ trợ Flash, bạn có thể triển khai một luồng HLS , mã hóa với API video HTML5 thông thường và tạo trải nghiệm video nhanh, chất lượng cao trên tất cả các danh mục thiết bị web lớn. * "Tuyệt vời! Đúng thứ tôi cần! Cảm ơn rất nhiều! –

+0

Đối với ứng dụng khách HLS là trình phát bất khả tri, hãy thử hls.js, được giới thiệu bởi DailyMotion. videojs-contrib-hls được gắn với video.js. – Fawntasia

2

Để có câu trả lời cập nhật hơn: MPEG-DASH đang trong quá trình thay thế HLS. HLS được sử dụng chủ yếu trong đất iOS. Hầu hết các trình duyệt máy tính để bàn không có kế hoạch hỗ trợ nó, và DASH là tiêu chuẩn mà chúng đang hướng tới. (Tuy nhiên, có rất nhiều trình phát được thiết kế để cho phép bạn sử dụng HLS với trình phát video HTML5 như hls.js). Người chơi DASH bao gồm Bitmovin, Google Shaka và hơn thế nữa. Nhiều người mã hóa cho cả HLS và DASH hiện tại. HLS cũng hỗ trợ mp4 phân mảnh.Xin lưu ý rằng bạn sẽ cần phải mã hóa video của bạn một cách chính xác phía máy chủ. Tài nguyên bổ sung: http://www.streamingmedia.com/Articles/Articles/Editorial/Featured-Articles/The-State-of-MPEG-DASH-2016-110099.aspx

0

Cho đến bây giờ, bạn sẽ phải cung cấp nội dung của mình trong MPEG-DASH và HLS để cung cấp hỗ trợ rộng rãi cho tất cả các nền tảng trên mạng. HLS hỗ trợ MP4 phân mảnh ngay bây giờ, bạn có thể sử dụng one single output format, phát trên mọi thiết bị. Hơn nữa, bạn cần 50% less storage và vì fMP4 có dung lượng lưu trữ hiệu quả hơn MPEG-TS, được sử dụng cho HLS vào lúc này, bạn có thể tiết kiệm nhiều dung lượng và băng thông hơn.

Bitmovin cung cấp example cách tạo nội dung FMP4 HLS và cách phát nội dung.

Các vấn đề liên quan