Вопросы Теги

Исходный код iframe в javascript [дубликат]

Включить переменную строки подключения перед запросом MySQL. Например, $connt в этом коде: 

$results = mysql_query($connt, "SELECT * FROM users");
338
задан Marco Bonelli 7 December 2015 в 15:30
поделиться

5 ответов

Политика одного и того же происхождения

Не путать с CORS !

Вы не можете получить доступ к <iframe> с разным началом с использованием JavaScript, это было бы огромным недостатком безопасности, если бы вы могли это сделать. Для браузеров того же происхождения блокируют сценарии, пытающиеся получить доступ к кадру с другим происхождением.

Происхождение считается другим, если не поддерживается хотя бы одна из следующих частей адреса: 

<protocol>://<hostname>:<port>/path/to/page.html

Протокол, имя хоста и порт должны быть одинаковыми для вашего домена, если вы хотите получить доступ к кадру.

Примеры

Вот что произойдет, пытаясь получить доступ к следующим URL-адресам из http://www.example.com/home/index.html 

URL                                             RESULT 
http://www.example.com/home/other.html       -> Success 
http://www.example.com/dir/inner/another.php -> Success 
http://www.example.com:80                    -> Success (default port for HTTP) 
http://www.example.com:2251                  -> Failure: different port 
http://data.example.com/dir/other.html       -> Failure: different hostname 
https://www.example.com/home/index.html.html -> Failure: different protocol 
ftp://www.example.com:21                     -> Failure: different protocol & port 
https://google.com/search?q=james+bond       -> Failure: different hostname & protocol

Обходное решение

-origin блокирует скрипты от доступа к содержимому сайтов с другим происхождением, если у вас есть обе страницы, вы можете обойти эту проблему, используя window.postMessage и ее относительное message событие для отправки сообщений между двумя страницами, например:

  • На главной странице: 
    var frame = document.getElementById('your-frame-id'); 

frame.contentWindow.postMessage(/*any variable or object here*/, '*');
  • На вашем <iframe> (см. основную страницу): 
    window.addEventListener('message', function(event) { 

    // IMPORTANT: Check the origin of the data! 
    if (~event.origin.indexOf('http://yoursite.com')) { 
        // The data has been sent from your site 

        // The data sent with postMessage is stored in event.data 
        console.log(event.data); 
    } else { 
        // The data hasn't been sent from your site! 
        // Be careful! Do not use it. 
        return; 
    } 
});

Этот метод может применяться в обоих направлениях, создавая слушателя на главной странице и получая ответы от фрейма. Та же логика также может быть реализована во всплывающих окнах и в основном в любом новом окне, создаваемом главной страницей (например, с использованием window.open() ), без какой-либо разницы.

Отключение политика того же происхождения в браузере

Уже есть некоторые хорошие ответы на эту тему (я просто нашел их googling), поэтому для браузеров, где это возможно, ll ссылку относительный ответ. Однако помните, что отключение политики одного и того же происхождения (или CORS) повлияет только на на ваш браузер . Кроме того, при запуске браузера с настройками безопасности с одинаковым исходным кодом отключены доступ к веб-сайту для ресурсов с перекрестными источниками, поэтому он очень опасен и должен выполняться только для целей разработки.

527
ответ дан Marco Bonelli 5 September 2018 в 09:33
поделиться

Проверьте веб-сервер домена для конфигурации http://www.<domain>.com для X-Frame-Options. Это функция безопасности, предназначенная для предотвращения атак типа clickJacking,

. Как работает clickJacking?

  1. Страница зла выглядит точно так же, как страница жертвы.
  2. Затем она обманула пользователей, указав их имя пользователя и пароль.

Технически зло имеет iframe с источником на страницу жертвы. 

<html>
    <iframe src='victim_domain.com'/>
    <input id="username" type="text" style="display: none;/>
    <input id="password" type="text" style="display: none;/>
    <script>
        //some JS code that click jacking the user username and input from inside the iframe...
    <script/>
<html>

Как работает функция безопасности

Если вы хотите, чтобы запрос веб-сервера отображался в iframe, добавьте x- frame-options

Параметры X-Frame DENY

Возможные варианты:

  1. SAMEORIGIN / / разрешить только моему собственному домену, сделать мой HTML внутри iframe.
  2. DENY // не разрешать отображение моего HTML внутри любого iframe
  3. "ALLOW-FROM https : //example.com/ "// разрешить определенному домену отображать мой HTML внутри iframe

Это пример конфигурации IIS: 

   <httpProtocol>
       <customHeaders>
           <add name="X-Frame-Options" value="SAMEORIGIN" />
       </customHeaders>
   </httpProtocol>

Решение вопроса

Если веб-сервер активировал функцию безопасности, это может привести к безопасности на стороне клиента как следует.

7
ответ дан floydian 5 September 2018 в 09:33
поделиться

В дополнение к ответу Марко Бонелли: лучший текущий способ взаимодействия между фреймами / фреймами использует window.postMessage , , поддерживаемый всеми браузерами

42
ответ дан Geert 5 September 2018 в 09:33
поделиться

Мое приложение разбилось с помощью SecurityError, если оно помещено внутри iframe. Проблема заключалась в том, что .animate({scrollTop: top}, 0) jQuery был применен непосредственно на window.

Удаление LOC устранило проблему для нас.

0
ответ дан Oorja 5 September 2018 в 09:33
поделиться

Для меня я хотел реализовать двухстороннее рукопожатие, то есть: - родительское окно будет загружаться быстрее iframe - iframe должен поговорить с родительским окном, как только он будет готов - родитель готов получить iframe message и replay

этот код используется для установки белой метки в iframe с использованием [CSS custom property] кода: iframe 

$(function() {
    window.onload = function() {
        // create listener
        function receiveMessage(e) {
            document.documentElement.style.setProperty('--header_bg', e.data.wl.header_bg);
            document.documentElement.style.setProperty('--header_text', e.data.wl.header_text);
            document.documentElement.style.setProperty('--button_bg', e.data.wl.button_bg);
            //alert(e.data.data.header_bg);
        }
        window.addEventListener('message', receiveMessage);
        // call parent
        parent.postMessage("GetWhiteLabel","*");
    }
});

parent 

$(function() {
    // create listener
    var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
    var eventer = window[eventMethod];
    var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
    eventer(messageEvent, function (e) {
        // replay to child (iframe) 
        document.getElementById('wrapper-iframe').contentWindow.postMessage(
            {
                event_id: 'white_label_message',
                wl: {
                    header_bg: $('#Header').css('background-color'),
                    header_text: $('#Header .HoverMenu a').css('color'),
                    button_bg: $('#Header .HoverMenu a').css('background-color')
                }
            },
            '*'
        );
    }, false);
});

Естественно, вы можете ограничить исход и текст, это легко работать с кодом. Я нашел этот пример полезным: [Междоменные сообщения с postMessage]

5
ответ дан Yakir Manor 5 September 2018 в 09:33
поделиться
Другие вопросы по тегам:

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