Воспроизведение локального (жесткого диска) видеофайла с помощью тега HTML5?

Я хочу добиться следующего.

<video src="file:///Users/username/folder/video.webm">
</video>

Цель состоит в том, что пользователь сможет выбрать файл со своего жесткого диска.

И причина не загрузки - это, конечно же, стоимость передачи и квота на хранение. Не будет никаких причин для сохранения файла.

Возможно ли это?

Ответы

Ответ 1

Можно воспроизводить локальный видеофайл.

<input type="file" accept="video/*"/>
<video controls autoplay></video>

Когда файл выбирается с помощью элемента input:

  • Событие
  • 'change' запущено
  • Получите первый File объект из input.files FileList
  • Сделайте URL-адрес объекта, который указывает на объект File
  • Установите URL-адрес объекта в свойство video.src

  • Откиньтесь назад и смотрите:)

http://jsfiddle.net/dsbonev/cCCZ2/embedded/result,js,html,css/

Ответ 2

Раньше эта проблема возникла некоторое время назад. Веб-сайт не смог получить доступ к видеофайлу на локальном ПК из-за настроек безопасности (на самом деле понятно) Единственный способ, которым я мог обойти это, - запустить веб-сервер на локальном ПК (server2Go), и все ссылки на видеофайл из Интернета были на localhost/video.mp4

<div id="videoDiv">
     <video id="video" src="http://127.0.0.1:4001/videos/<?php $videoFileName?>" width="70%" controls>
    </div>
<!--End videoDiv-->

Не идеальное решение, но работало для меня.

Ответ 3

Это будет возможно только в том случае, если HTML файл также будет загружен протоколом file из локального жесткого диска пользователя.

Если HTML-страница обслуживается HTTP с сервера, вы не можете получить доступ к локальным файлам, указав их в атрибуте src с помощью протокола file://, поскольку это означает, что вы можете получить доступ к любому файлу пользователей компьютер без того, чтобы пользователь знал, что представляет собой огромный риск для безопасности.

Как сказал Димитар Бонев, вы можете получить доступ к файлу, если пользователь сам выбирает его с помощью селектора файлов. Без этого шага это запрещено всеми браузерами по уважительным причинам. Таким образом, хотя его ответ может оказаться полезным для многих людей, он освобождает требование от кода в исходном вопросе.