Как превратить file-ссылку в blob-ссылку, для работы с canvas?

Question

Hidden Fronter @AlTerminator

JavaScript

Как превратить file-ссылку в blob-ссылку, для работы с canvas?

<html>
<body>
<video src="test.mp4" controls onclick="VideoClick()"></video>
<script>
function VideoClick()
{
 //Как здесь получить источник видео в виде "blob:", а не "file:" ?
}
</script>
</body>
</html>

Вопрос задан 5 часов назад
80 просмотров

11 комментариев

Подписаться 1 Средний 11 комментариев

Ivan Ustûžanin @IvanU7n

а зачем blob? в любом случае для этого файл нужно скачать в, например, Blob через fetch() + blob(), а потом его скормить в URL.createObjectURL()

Написано 5 часов назад
Aetae @Aetae Куратор тега JavaScript

Ты задачу то опиши, у меня есть сильное подозрение, что ты не понимаешь, что такое blob.

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

Написано 5 часов назад
Hidden Fronter @AlTerminator Автор вопроса

Aetae, для себя делаю, плеер. Хочется создать превьюхи для загруженных видео, а canvas не работает с "file:", только с blob. Вот и решил конвертировать, чтобы обойтись без сервера. Интересно, а с "data:" canvas работает?

Написано 5 часов назад
Hidden Fronter @AlTerminator Автор вопроса

Ivan Ustûžanin, хочу сделать превью для видео, canvas работает только с blob, поэтому нужен blob. Может и "data:" работает, не знаю.

Написано 5 часов назад
Aetae @Aetae Куратор тега JavaScript
Hidden Fronter, удивлюсь если с blob заработает, наверняка по говносекурити отрубит.
Ну и чтоб получить тебе надо всё это test.mp4 в память браузера(оперативку) выкачать. Ты уверен что этого хочешь?

Код примерно такой:

onclick="VideoClick(this)" async function VideoClick(video) { const blob = await fetch(video.src).then(v => v.blob()); const url = URL.createObjectURL(blob); console.log(url) }
Написано 5 часов назад
Hidden Fronter @AlTerminator Автор вопроса

Aetae, согласен, лишь бы заработало. Кстати, с "data:" canvas работает?

Написано 4 часа назад
Adamos @Adamos

Превью видео делается одним запросом к ffmpeg на стороне сервера.
А задуманное - это классическое "вырезаем гланды автогеном через задницу", не имеет права на существование.

Написано 4 часа назад
Hidden Fronter @AlTerminator Автор вопроса

Adamos, хочется без всяких библиотек и прочего. На чистом JS.

Написано 4 часа назад
Adamos @Adamos

Hidden Fronter, а скачать весь рунет себе на страничку не хочется? На чистом жс?
Надо же хоть как-то соизмерять затраты и цели.

Написано 4 часа назад
Hidden Fronter @AlTerminator Автор вопроса

Aetae, не работает. А с "data:" canvas сработает?

Написано 4 часа назад
Aetae @Aetae Куратор тега JavaScript

Hidden Fronter, да, но какая разница? Оно или даёт выкачать и тогда и blob будет работать, или не даёт и тогда откуда ты data uri возьмёшь?

Написано 2 часа назад

Пригласить эксперта

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

JavaScript

Простой
Почему корректно не валидируются поля password формы?
- 1 подписчик
- 2 часа назад
- 48 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как заполнить поле автоматически с Tampermonkey?
- 4 подписчика
- 10 часов назад
- 229 просмотров
1

ответ
JavaScript

Простой
Как корректно посчитать разницу в moment js?
- 1 подписчик
- 11 часов назад
- 80 просмотров
1

ответ
JavaScript

+3 ещё

Средний
Почему 426 статус при запуске страпи?
- 1 подписчик
- 15 часов назад
- 78 просмотров
0

ответов
JavaScript

Простой
Почему ajax выполняется по очереди?
- 1 подписчик
- вчера
- 100 просмотров
1

ответ
JavaScript

+2 ещё

Простой
Как мне написать скрипт для вывода изображения bootstrap 5 и js?
- 1 подписчик
- вчера
- 66 просмотров
1

ответ
JavaScript

Простой
Почему некорректно срабатывает функция .hasClass?
- 1 подписчик
- вчера
- 148 просмотров
2

ответа
JavaScript

Средний
Как объединить ключи и значения объекта или get параметров строки?
- 1 подписчик
- вчера
- 99 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как изменить скрипт сайта через js?
- 1 подписчик
- вчера
- 83 просмотра
2

ответа
Показать ещё Загружается…

JavaScript Разработчик

Photo Lab

от 4 000 €

JavaScript разработчик

вАйТи

от 1 000 до 25 000 ₽

Frontend разработчик/ JavaScript разработчик

Mish

от 170 000 до 210 000 ₽

Создание планировок в Планоплане

07 окт. 2024, в 17:51

10000 руб./за проект

Пофиксить верстку в проекте Angular

07 окт. 2024, в 17:35

12000 руб./за проект

Парсить новости с группы Телеграм

07 окт. 2024, в 16:30

1000 руб./за проект

а зачем blob? в любом случае для этого файл нужно скачать в, например, Blob через fetch() + blob(), а потом его скормить в URL.createObjectURL()
Ты задачу то опиши, у меня есть сильное подозрение, что ты не понимаешь, что такое blob.

В любом случае file ссылку ты можешь получить только открывая html файл локально - не надо этого делать. Забудь о локальных файлах, они практически не поддерживаются и не работают, особенно со скриптами. Даже если делаешь что-то для себя - проще развернуть мини-сервер или электрон, чем возиться с произвольными недокументированными и постоянно меняющимися ограничениями.
Aetae, для себя делаю, плеер. Хочется создать превьюхи для загруженных видео, а canvas не работает с "file:", только с blob. Вот и решил конвертировать, чтобы обойтись без сервера. Интересно, а с "data:" canvas работает?
Ivan Ustûžanin, хочу сделать превью для видео, canvas работает только с blob, поэтому нужен blob. Может и "data:" работает, не знаю.
Hidden Fronter, удивлюсь если с blob заработает, наверняка по говносекурити отрубит.
Ну и чтоб получить тебе надо всё это test.mp4 в память браузера(оперативку) выкачать. Ты уверен что этого хочешь?

Код примерно такой:

onclick="VideoClick(this)" async function VideoClick(video) { const blob = await fetch(video.src).then(v => v.blob()); const url = URL.createObjectURL(blob); console.log(url) }
Aetae, согласен, лишь бы заработало. Кстати, с "data:" canvas работает?
Превью видео делается одним запросом к ffmpeg на стороне сервера.
А задуманное - это классическое "вырезаем гланды автогеном через задницу", не имеет права на существование.
Adamos, хочется без всяких библиотек и прочего. На чистом JS.
Hidden Fronter, а скачать весь рунет себе на страничку не хочется? На чистом жс?
Надо же хоть как-то соизмерять затраты и цели.
Aetae, не работает. А с "data:" canvas сработает?
Hidden Fronter, да, но какая разница? Оно или даёт выкачать и тогда и blob будет работать, или не даёт и тогда откуда ты data uri возьмёшь?

Как превратить file-ссылку в blob-ссылку, для работы с canvas?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт