Как сделать предпросмотр видео в формате m3u8 в videojs после загрузки через input?

Мне нужно загружать видео в формате m3u8 на сервер через input с устройства, но при этом помещать их в плеер videojs для предпросмотра, как можно это сделать? Сам плеер прекрасно читает этот формат и без проблем проигрывает видео, которые уже есть на сервере.

Рабочий пример на HTML5 теге video (с mp4):

<video class="player" src="url..." controls style="width: 700px;"></video>

<input class="upload" type="file">
<script>
    document.querySelector('.upload').addEventListener('change', function() {
        const video = this.files[0];
        const url = URL.createObjectURL(video);
        document.querySelector(".player").src = url;
    }
</script>

Но подобный способ не работает в моем случае, в консоли вылазит ошибка: "Uncaught TypeError: Failed to construct 'URL': Invalid URL" и видео конечно же не грузится.

Вот какой вид имеет скрипт моего videojs:

const player = videojs('player', {
    aspectRatio: '16:9',
    html5: {
        vhs: {
            withCredentials: true,
        }
    },
    restoreEl: true
});
player.src({type: 'application/x-mpegURL', src: url});
player.hlsQualitySelector({
    displayCurrentQuality: true,
});

После загрузки нового видео через input, я инициализирую плеер и подставляю url, как в примере с HTML5 тегом выше, в src.

Помогите, пожалуйста, с решением этой проблемы!