Блог

Главная - Вопросы по программированию - Почему мое видео на Youtube не отображается в iFrame с Next.js а УИкит?

Почему мое видео на Youtube не отображается в iFrame с Next.js а УИкит?

#reactjs #iframe #next.js #uikit

#reactjs #iframe #next.js #uikit

Вопрос:

Я поместил тег iFrame в свой Next.js компонент. На моем веб-сайте я вижу фрейм, но на нем написано «Youtube не разрешает это соединение». Что не так?

Вот мой код:

             <iframe 
                src="https://www.youtube.com/watch?v=E8gmARGvPlI" 
                width="1920" 
                height="1080" 
                frameBorder="0" 
                allowFullScreen 
                uk-responsive 
                uk-video="automute: true">
            </iframe>

Ответ №1:

Если вы хотите воспроизводить видео YouTube в iframe, вам нужно сделать это с помощью их API. Вы можете узнать больше о том, как это сделать, здесь — https://developers.google.com/youtube/iframe_api_reference

Если вы просто хотите встроить видео без внешнего контроля над видео, вы можете просто его встроить. Подробнее о встраивании здесь — https://support.google.com/youtube/answer/171780?hl=en

Комментарии:

1. Это было очень полезно, спасибо.

Ответ №2:

вы получаете идентификатор видео с помощью API YouTube

 <iframe
          id="ytplayer"
          className={}
          type="text/html"
          width="100%"
          height="360"
          src={`https://www.youtube.com/embed/${videoId}?autoplay=0amp;origin=http://example.comamp;controls=0amp;rel=1`}
          frameborder="0"
        ></iframe>
Метки: