Html5 атрибут загрузки не работает, когда URL-адрес blob-url
Мы создаем расширение chrome для загрузки видео, в настоящее время у меня есть эта функция:
function downloadvideo(video)
{
const url = URL.createObjectURL(video.captureStream());
const aelem = document.createElement('a');
document.body.appendChild(aelem);
aelem.setAttribute("href",url);
aelem.setAttribute("download","video.mp4");
aelem.click();
//URL.revokeObjectURL(url);
}
Здесь video
параметр - это элемент html5 video, я использую caputreStream
, потому что некоторые веб-сайты (особенно youtube) используют blob-url, которые явно отменены. Поэтому я создаю новый URL-адрес Blob из MediaStream
.
Функция выше выполняется как часть видео onloadeddata
.
Диалоговое окно отображается, и имя файла верное, но когда я нажимаю "Сохранить", хром говорит "не удалось: не удалось найти файл".
Итак, как это сделать на самом деле?
Кстати, я пытался сделать ajax против url
, но хром отказывается от сообщения: "Cross-origin поддерживается только для схем http, https, chrome, chrome-extension": 3.
Ответы
Ответ 1
URL.createObjectURL()
Примечание. Использование объекта MediaStream в качестве входа в этот метод находится в процессе устаревания. Продолжается дискуссия о том, следует ли его полностью удалить. Таким образом, вы должны попытаться избежать использования этого метода с помощью MediaStreams и вместо этого использовать HTMLMediaElement.srcObject().
Ссылка: https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL#Browser_compatibility
https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/srcObject#Browser_compatibility
Код:
функция downloadvideo (видео)
{
var mediaStream = video.captureStream();
//adding a dom element and fetching it in HTMLMediaElement.
HTMLMediaElement.srcObject = mediaStream;
var url = HTMLMediaElement.currentSrc;
const aelem = document.createElement('a');
document.body.appendChild(aelem);
aelem.setAttribute("href",url);
aelem.setAttribute("download","video.mp4");
aelem.click();
//URL.revokeObjectURL(url);
}
Посмотрите, работает ли это для вас.
Ответ 2
Вот функция, которую я использовал для загрузки видео в bloburl, который я сохранил из захвата кадра холста
function createdVideo(){
var output = 'your video or captured stream or canvas capture'
var url = webkitURL.createObjectURL(output);
// output_video.src = url; //toString converts it to a URL via Object URLs, falling back to DataURL
download.href = url;//download is id of download link which als ohave download atribute}
i Надежда будет работать в вашем случае