Почему возникает ошибка при попытке получить объект видео с помощью "fetch" на сайте Rutube?

Ошибка может возникать при попытке получения объекта видео с помощью Fetch API на сайте Rutube из-за политики безопасности браузера, известной как политика Same-Origin. Эта политика запрещает скриптам на веб-странице получать ресурсы (такие как видео) с других доменов, если не установлен заголовок Access-Control-Allow-Origin на сервере, с которого запрашивается ресурс.

Когда вы переходите по ссылке на сайте Rutube, ваш браузер отображает объект видео, потому что сам контент загружается непосредственно из Rutube, и браузер не применяет политику Same-Origin к этому процессу.

Однако, при использовании Fetch API для получения объекта видео, скрипт на вашей веб-странице пытается получить ресурс напрямую с сервера Rutube, и если сервер Rutube не возвращает заголовок Access-Control-Allow-Origin или настроен неправильно, браузер блокирует запрос из-за политики Same-Origin.

Чтобы успешно получить объект видео с помощью Fetch API на сайте Rutube, необходимо, чтобы сервер Rutube разрешил доступ к ресурсу с вашего домена путем установки заголовка Access-Control-Allow-Origin.

<a href="https://qna.habr.com/user/Shimpanze" rel="nofollow">Shimpanze</a> , <blockquote>Какого его не может получить «fetch»?</blockquote> Через браузер вы обращаетесь от домена эндпоинта, от которого хотите получить информацию. <br/> У рутуба настроена политика CORS. Лучше обратиться к официальной документации, но если не хотите, то пользоваться чем-то подобным: <br/> <br/> <pre><code class="javascript">const proxyUrl = 'https://api.allorigins.win/get?url=';
const targetUrl = 'https://rutube.ru/api/video/37daa4e656174d04db06c5fca7548751';

fetch(proxyUrl + encodeURIComponent(targetUrl))
    .then(response =&gt; {
        if (!response.ok) {
            throw new Error('Network response was not ok');
        }
        return response.json();
    })
    .then(data =&gt; {
        // данные могут быть внутри data.contents
        console.log('Data retrieved:', JSON.parse(data.contents));
    })
    .catch(error =&gt; {
        console.error('There was a problem with the fetch operation:', error);
    });</code></pre>