Как превратить 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>

Вопрос задан более года назад
155 просмотров

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

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

Ivan Ustûžanin @IvanU7n

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

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

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

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

Написано более года назад
Hidden Fronter @AlTerminator Автор вопроса

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

Написано более года назад
Hidden Fronter @AlTerminator Автор вопроса

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

Написано более года назад
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) }
Написано более года назад
Hidden Fronter @AlTerminator Автор вопроса

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

Написано более года назад
Adamos @Adamos

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

Написано более года назад
Hidden Fronter @AlTerminator Автор вопроса

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

Написано более года назад
Adamos @Adamos

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

Написано более года назад
Hidden Fronter @AlTerminator Автор вопроса

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

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

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

Написано более года назад

Помогут разобраться в теме Все курсы

Нетология

Веб-разработчик с нуля: профессия с выбором специализации

14 месяцев

Далее
Академия Эдюсон

Fullstack-разработчик на JavaScript

11 месяцев

Далее
ProductStar × РБК

Профессия: Инженер по тестированию

6 месяцев

Далее

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

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

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

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

JavaScript

Простой
Почему при написании цикла for of работает, а при другом цикле не работает?
- 1 подписчик
- 15 апр.
- 360 просмотров
3

ответа
JavaScript

Простой
Почему зависает приложение? Почему не работает функция сортировки?
- 1 подписчик
- 14 апр.
- 234 просмотра
1

ответ
JavaScript

Простой
Почему не работает фильтрация?
- 1 подписчик
- 14 апр.
- 163 просмотра
1

ответ
JavaScript

+1 ещё

Простой
Как обновлять данные массива, чтобы по нажатию на кнопку на странице добавлялся еще один элемент массива?
- 3 подписчика
- 12 апр.
- 717 просмотров
4

ответа
JavaScript

+1 ещё

Простой
Почему не работает код из js файла?
- 3 подписчика
- 12 апр.
- 670 просмотров
4

ответа
JavaScript

+1 ещё

Простой
Как остаться на той же странице при скачивании файла?
- 1 подписчик
- 08 апр.
- 302 просмотра
2

ответа
JavaScript

+1 ещё

Простой
Как отправить ajax запрос по чекбоксам?
- 2 подписчика
- 07 апр.
- 217 просмотров
1

ответ
JavaScript

Простой
Как избежать в выводе 5?
- 1 подписчик
- 30 мар.
- 329 просмотров
1

ответ
JavaScript

Простой
Как правильно просчитывать?
- 1 подписчик
- 28 мар.
- 270 просмотров
1

ответ
JavaScript

+2 ещё

Средний
Авторизация вконтакте как настроить?
- 2 подписчика
- 26 мар.
- 377 просмотров
1

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

Frontend-разработчик (vanilla JS, high-load)

Karma8

от 200 000 ₽

Fullstack developer (python/react)

Крона Лабс • Екатеринбург

от 200 000 ₽

Frontend Developer (Vue.js) Middle / Senior

UPBEAT SOFT

от 150 000 до 300 000 ₽

а зачем 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?

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

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

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