iframe и внешний сайт

Question

Итак, у меня есть этот код:

<iframe id="theFrame" src="http://localhost" style="width:100%;" frameborder="0">
</iframe>

и локальный сайт загружен в iframe просто отлично ..

но потом, когда я изменяю src на внешний сайт

<iframe id="theFrame" src="http://www.youtube.com" style="width:100%;" frameborder="0">
</iframe>

Сайт не загружен.

Что я сделал не так?Я знаю, что вы можете использовать внешние сайты в iframe, так как Google Image Search делает это ...

Как мне заставить внешние сайты работать в моем iframe?

Answer 1

Причина, по которой внешние сайты, такие как:

1. youtube.com
2. google.com
3. 1008 * stackoverflow.com *
4. и т.д.

не загружают в ваш кадр, потому что они намеренно используют какой-то Frame Killer .

Пример (использует jQuery) :

<style> html{display:none;} </style>
<script type="text/javascript">
    $(document).ready(function () {
        if(window.self == window.top) {
            document.documentElement.style.display = 'block'; }
        else {
       window.top.location = window.self.location; }
    });
</script>

Рекомендуемое чтение:

• Framekiller (Википедия)
• Уничтожение крутого убийцы FRAME

Answer 2

Вы, вероятно, испытываете те же проблемы, что и у меня. Скорее всего, iframe блокируется параметрами X-frame или блокируется свойством Deny. Например, если вы заходите на Facebook из внешнего источника, он вернется с ответом DENY в Google Chrome

Answer 3

Если вы запустите фрагмент кода ниже:

<iframe src="https://www.youtube.com"></iframe>

Затем посмотрите на инструменты разработчика, он выдаст ошибку:

Отказал отображать 'https://www.youtube.com/' в кадре, потому чтоон устанавливает «X-Frame-Options» на «sameorigin».

Это потому, что сайт, к которому вы пытаетесь получить доступ к встраиванию ограничений (через iframe, frame, embed, object) к тому же источнику, используя заголовок X-Frame-Options .Таким образом, youtube.com может нормально загружать фреймы со страницами youtube.com, но никто другой не может.Только администраторы сайта для встроенного сайта могут изменять этот параметр.

Если у вас есть администратор для сайта, который вы встраиваете, вы можете внести в белый список хост-сайт:

X-Frame-Options: allow-from https://my-host-site.com/

Это должно быть отправлено как заголовок HTTP сервером страницы, которую вы пытаетесь внедрить.Он не будет работать как тег meta внутри HTML head.Таким образом, браузер узнает, что вы встраиваете сайт, и сайт, на котором вы размещаете, чтобы показать страницу в iframe.

Answer 4

Кажется, это проблема только для YouTube; src = "http://www.mozilla.org" работает для меня в вашем коде. Если вы хотите отображать видео на YouTube в iframes, они, вероятно, захотят, чтобы вы использовали опцию" embed "на странице видео?