Рамка Buster Buster… потрібен код Buster

Скажімо, ви не хочете, щоб інші сайти "обрамляли" ваш сайт у <iframe>:

<iframe src="http://example.org"></iframe>

Таким чином, ви вставляєте JavaScript на рамки, що перемикає рамки, на всі ваші сторінки:

/* break us out of any containing iframes */
if (top != self) { top.location.replace(self.location.href); }

Відмінно! Тепер ви автоматично «вибиваєтесь» або вириваєтесь із будь-якого містяться iframe. За винятком однієї невеликої проблеми.

Як виявилося, ваш код , що перебуває у кадрі, може бути розбитий , як показано тут :

<script type="text/javascript">
    var prevent_bust = 0  
    window.onbeforeunload = function() { prevent_bust++ }  
    setInterval(function() {  
      if (prevent_bust > 0) {  
        prevent_bust -= 2  
        window.top.location = 'http://example.org/page-which-responds-with-204'  
      }  
    }, 1)  
</script>

Цей код виконує наступне:

• збільшує лічильник щоразу, коли браузер намагається перейти подалі від поточної сторінки через window.onbeforeunloadобробник подій
• встановлює таймер, який спрацьовує кожну мілісекунду через setInterval(), і якщо він бачить лічильник посиленим, змінює поточне місцезнаходження на сервер управління зловмисником
• цей сервер обслуговує сторінку з кодом статусу HTTP 204 , що не призводить до того, що браузер нікуди не рухається

Моє запитання - і це скоріше головоломка JavaScript, ніж реальна проблема - як ви можете перемогти перетворювач кадрів?

У мене було кілька думок, але в моєму тестуванні нічого не вийшло:

• спроба очистити onbeforeunloadподію onbeforeunload = nullне дала ефекту
• додавши alert()зупинений процес, дайте користувачеві знати, що це відбувається, але жодним чином не втручався в код; натискання кнопки "ОК" дозволяє продовжувати зйомки як завжди
• Я не можу придумати жодного способу очистити setInterval()таймер

Я не дуже програміст JavaScript, тому ось моє завдання перед вами: ей, Бастер, чи можете ви перебити каркас?

Я не впевнений, чи це життєздатно чи ні - але якщо ви не можете зламати кадр, чому б просто не показати попередження. Наприклад, якщо ваша сторінка не є "верхньою сторінкою", створіть метод setInterval, який намагається зламати кадр. Якщо після 3 або 4 спроб ваша сторінка все ще не є верхньою сторінкою - створіть елемент div, який охоплює всю сторінку (модальне поле) з повідомленням і посиланням, як ...

Ви переглядаєте цю сторінку в несанкціонованому вікні кадру - (бла-бла ... потенційна проблема безпеки)

натисніть це посилання, щоб усунути цю проблему

Не найкраще, але я не бачу жодного способу, щоб вони могли вийти з цього шляху.

FWIW, більшість сучасних браузерів підтримують на X-Frame-Options: заборонити директиву, яка працює навіть тоді , коли скрипт відключений.

IE8:
http://blogs.msdn.com/ie/archive/2009/01/27/ie8-security-part-vii-clickjacking-defenses.aspx

Firefox (3.6.9)
https://bugzilla.mozilla.org/show_bug.cgi?id=475530
https://developer.mozilla.org/en/The_X-FRAME-OPTIONS_response_header

Chrome / Webkit
http://blog.chromium.org/2010/01/security-in-depth-new-security-features.html
http://trac.webkit.org/changeset/42333

Ми використовували такий підхід на одному з наших веб-сайтів з http://seclab.stanford.edu/websec/framebusting/framebust.pdf

<style>
 body { 
 display : none   
}
</style>
<script>
if(self == top) {
document.getElementsByTagName("body")[0].style.display = 'block';
}
else{
top.location = self.location;
}
</script>

Придумав це, і, здається, працює принаймні у Firefox та браузері Opera.

if(top != self) {
 top.onbeforeunload = function() {};
 top.location.replace(self.location.href);
}

Враховуючи поточний стандарт HTML5, який запровадив пісочну скриньку для iframe, усі коди перебору кадрів, що надаються на цій сторінці, можна відключити, коли зловмисник використовує пісочницю, оскільки це обмежує iframe від наступного:

allow-forms: Allow form submissions.
allow-popups: Allow opening popup windows.
allow-pointer-lock: Allow access to pointer movement and pointer lock.
allow-same-origin: Allow access to DOM objects when the iframe loaded form same origin
allow-scripts: Allow executing scripts inside iframe
allow-top-navigation: Allow navigation to top level window

Перегляньте: http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#attr-iframe-sandbox

Тепер, подумайте, що зловмисник використовував наступний код для розміщення вашого сайту в iframe:

<iframe src="URI" sandbox></iframe>

Тоді, весь код перебору кадру JavaScript буде відмовлений.

Перевіривши весь код завантаження кадру, лише ця захист працює у всіх випадках:

<style id="antiClickjack">body{display:none !important;}</style>
<script type="text/javascript">
   if (self === top) {
       var antiClickjack = document.getElementById("antiClickjack");
       antiClickjack.parentNode.removeChild(antiClickjack);
   } else {
       top.location = self.location;
   }
</script>

що спочатку запропонували Густав Райдштет, Елі Бурштейн, Ден Боне та Колін Джексон (2010)

Трохи задумавшись над цим, я вірю, що це покаже їм, хто бос ...

if(top != self) {
  window.open(location.href, '_top');
}

Використовуючи _topяк цільовий параметр для window.open(), запустіть його в тому ж вікні.

if (top != self) {
  top.location.replace(location);
  location.replace("about:blank"); // want me framed? no way!
}

Я збираюся бути сміливим і кидаю капелюх на ринг на цьому (давній, як це є), подивіться, скільки лісів я можу зібрати.

Ось моя спроба, яка, здається, працює всюди, де я її перевірив (Chrome20, IE8 і FF14):

(function() {
    if (top == self) {
        return;
    }

    setInterval(function() {
        top.location.replace(document.location);
        setTimeout(function() {
            var xhr = new XMLHttpRequest();
            xhr.open(
                'get',
                'http://mysite.tld/page-that-takes-a-while-to-load',
                false
            );
            xhr.send(null);
        }, 0);
    }, 1);
}());

Я помістив цей код у <head>і назвав його з кінця сторінки, <body>щоб переконатися, що моя сторінка виведена до того, як вона почне сперечатися зі шкідливим кодом, не знаю, чи це найкращий підхід, YMMV.

Як це працює?

... Я чую, що ви запитуєте - ну чесна відповідь, я насправді не знаю. Потрібно було багато хитрощів, щоб змусити його працювати скрізь, де я тестував, і точний ефект, який він має, незначно змінюється залежно від місця його запуску.

Ось мислення за цим:

• Встановіть функцію, щоб вона працювала на мінімально можливому інтервалі. Основна концепція будь-якого з реалістичних рішень, які я бачив, - це заповнити планувальник більшістю подій, ніж має кадр-бустер.
• Кожен раз, коли функція спрацьовує, спробуйте змінити розташування верхнього кадру. Досить очевидна вимога.
• Також заплануйте негайно запустити функцію, яка потребуватиме тривалого часу (тим самим блокуючи перемикач кадрів від перешкод для зміни місця розташування). Я вибрав синхронний XMLHttpRequest, тому що це єдиний механізм, про який я думаю, що не вимагає (або принаймні запитувати) взаємодії з користувачем і не розжовує час процесора користувача.

Для моєї http://mysite.tld/page-that-takes-a-while-to-load(цілі XHR) я використав сценарій PHP, який виглядає приблизно так:

<?php sleep(5);

Що сталося?

• Chrome і Firefox чекають 5 секунд, поки завершиться XHR, після чого успішно переспрямуйте на URL-адресу оформленої сторінки.
• IE майже відразу переадресовує

Ви не можете уникнути часу очікування в Chrome і Firefox?

Мабуть, ні. Спочатку я вказав XHR на URL, який повертав би 404 - це не працювало у Firefox. Тоді я спробував sleep(5);підхід, який я врешті-решт приземлився для цієї відповіді, потім я різними способами почав грати довкола сну. Я не міг знайти реальну схему поведінки, але я виявив, що якщо вона занадто коротка, конкретно Firefox не буде грати в м'яч (Chrome і IE, схоже, ведуть себе досить добре). Я не знаю, що таке поняття "занадто коротке" в реальному вираженні, але 5 секунд, здається, працює кожен раз.

Якщо будь-які перехожі ніндзя Javascript хочуть трохи краще пояснити, що відбувається, чому це (ймовірно) неправильно, ненадійно, найгірший код, який вони коли-небудь бачили тощо. Я з радістю слухаю.

З 2015 року для цього слід використовувати frame-ancestorsдирективу CSP2 . Це реалізується через заголовок відповіді HTTP.

напр

Content-Security-Policy: frame-ancestors 'none'

Звичайно, не дуже багато браузерів підтримують CSP2, але розумно включити старий X-Frame-Optionsзаголовок:

X-Frame-Options: DENY

Я б радив включати обидва в будь-якому випадку, інакше ваш сайт буде залишатися вразливим до атак Clickjacking у старих браузерах, і, звичайно, ви отримаєте небажане обрамлення навіть без шкідливих намірів. Більшість браузерів оновлюються автоматично ці дні, однак ви все ще схильні заставляти корпоративних користувачів на старих версіях Internet Explorer із застарілих причин сумісності програм.

Гаразд, тому ми знаємо, що були в кадрі. Тож ми розміщуємо.href на іншу спеціальну сторінку з контуром як GET-змінною. Тепер ми пояснюємо користувачеві, що відбувається, і надаємо посилання з опцією target = "_ TOP". Це просто і, ймовірно, працює (ще не перевіряли його), але це вимагає певної взаємодії з користувачем. Можливо, ви могли вказати користувачу сайт, що ображає, і зробити кудись сором, якийсь десь на вашому сайті кладет хакери .. Просто ідея, але це працює ніч ..

Всі запропоновані рішення безпосередньо змушують змінити місце розташування верхнього вікна. Що робити, якщо користувач хоче, щоб кадр був там? Наприклад, верхній кадр в результатах зображення пошукових систем.

Я написав прототип, де за замовчуванням усі входи (посилання, форми та елементи введення) відключені та / або нічого не роблять при активації.

Якщо кадр, що містить міститься, вхідні дані залишаються відключеними, а вгорі сторінки відображається попереджувальне повідомлення. Попереджувальне повідомлення містить посилання, яке відкриє безпечну версію сторінки в новому вікні. Це запобігає використанню сторінки для переключення кліків, при цьому все ж дозволяє користувачеві переглядати вміст в інших ситуаціях.

Якщо не знайдено жодного фрейму, що міститься, вхід увімкнено.

Ось код. Потрібно встановити стандартні атрибути HTML на безпечні значення та додати додаткові атрибути, що містять фактичні значення. Це, мабуть, неповно, і для повної безпеки додаткові атрибути (я маю на увазі обробників подій), ймовірно, повинні будуть трактуватися так само:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
  <head>
    <title></title>
    <script><!--
      function replaceAttributeValuesWithActualOnes( array, attributeName, actualValueAttributeName, additionalProcessor ) {
        for ( var elementIndex = 0; elementIndex < array.length; elementIndex += 1 ) {
          var element = array[ elementIndex ];
          var actualValue = element.getAttribute( actualValueAttributeName );
          if ( actualValue != null ) {
            element[ attributeName ] = actualValue;
          }

          if ( additionalProcessor != null ) {
            additionalProcessor( element );
          }
        }
      }

      function detectFraming() {
        if ( top != self ) {
          document.getElementById( "framingWarning" ).style.display = "block";
        } else {
          replaceAttributeValuesWithActualOnes( document.links, "href", "acme:href" );

          replaceAttributeValuesWithActualOnes( document.forms, "action", "acme:action", function ( form ) {
            replaceAttributeValuesWithActualOnes( form.elements, "disabled", "acme:disabled" );
          });
        }
      }
      // -->
    </script>
  </head>
  <body onload="detectFraming()">
    <div id="framingWarning" style="display: none; border-style: solid; border-width: 4px; border-color: #F00; padding: 6px; background-color: #FFF; color: #F00;">
      <div>
        <b>SECURITY WARNING</b>: Acme App is displayed inside another page.
        To make sure your data is safe this page has been disabled.<br>
        <a href="framing-detection.html" target="_blank" style="color: #090">Continue working safely in a new tab/window</a>
      </div>
    </div>
    <p>
      Content. <a href="#" acme:href="javascript:window.alert( 'Action performed' );">Do something</a>
    </p>
    <form name="acmeForm" action="#" acme:action="real-action.html">
      <p>Name: <input type="text" name="name" value="" disabled="disabled" acme:disabled=""></p>
      <p><input type="submit" name="save" value="Save" disabled="disabled" acme:disabled=""></p>
    </form>
  </body>
</html>

Ну, ви можете змінити значення лічильника, але це, очевидно, крихке рішення. Ви можете завантажувати свій вміст через AJAX після того, як визначите, що сайт знаходиться не в рамках - також не чудове рішення, але, сподіваємось, уникнете запуску події перед завантаженням (я припускаю).

Правка: Ще одна ідея. Якщо ви виявите, що ви знаходитесь у кадрі, попросіть користувача відключити javascript, перш ніж натиснути на посилання, яке перенаправляє вас до потрібної URL-адреси (передаючи рядок запитів, що дозволяє вашій сторінці знати, щоб сказати користувачеві, що вони можуть знову включити javascript, як тільки вони є там).

Редагувати 2: Перейти до ядерної - якщо ви виявите, що перебуваєте у кадрі, просто видаліть вміст тіла документа та надрукуйте якесь неприємне повідомлення.

Редагувати 3: Чи можна перерахувати верхній документ і встановити всі функції на нуль (навіть анонімні)?

Якщо ви додасте попередження одразу після коду маршрутизатора, то сповіщення зупинить потік javascript, і це дозволить завантажувати сторінку. Це те, що робить StackOverflow, і воно вибивається з моїх кадрів, навіть коли я використовую перемикач кадру. Це також працювало з моєю простою тестовою сторінкою. Це було протестовано лише у Firefox 3.5 та IE7 на windows.

Код:

<script type="text/javascript">
if (top != self){
  top.location.replace(self.location.href);
  alert("for security reasons bla bla bla");
}
</script>

Я думаю, ти майже був там. Ти намагався:

window.parent.onbeforeunload = null;
window.parent.location.replace(self.location.href);

або, альтернативно:

window.parent.prevent_bust = 0;

Примітка: я насправді цього не перевіряв.

А як з тим, щоб дзвонити до цього ще раз? Це створить умову гонки, але можна сподіватися, що бастер вийде на вершину:

(function() {
    if(top !== self) {
        top.location.href = self.location.href;
        setTimeout(arguments.callee, 0);
    }
})();

Якщо ви подивитеся на значення, що повертаються, setInterval()вони зазвичай є одноцифровими, тож ви можете вимкнути всі такі переривання одним рядком коду:

for (var j = 0 ; j < 256 ; ++j) clearInterval(j)

Я, можливо, тільки що знайшов спосіб розбити javascript-роутер Buster. Використовуючи функцію getElementsByName у своїй функції javascript, я встановив цикл між накопичувачем кадрів та фактичним сценарієм запуску кадрів. перевірити цю публікацію. http://www.phcityonweb.com/frame-buster-buster-buster-2426

setInterval і setTimeout створюють інтервал автоматичного збільшення. Кожен раз, коли викликається setTimeout або setInterval, це число збільшується на одиницю, так що якщо ви зателефонуєте на setTimeout, ви отримаєте поточне, найвище значення.

   var currentInterval = 10000;
   currentInterval += setTimeout( gotoHREF, 100 );
   for( var i = 0; i < currentInterval; i++ ) top.clearInterval( i );
   // Include setTimeout to avoid recursive functions.
   for( i = 0; i < currentInterval; i++ )     top.clearTimeout( i );

   function gotoHREF(){
           top.location.href = "http://your.url.here";
   }

Оскільки майже не чутно, щоб було 10000 одночасних встановлених інтервалів та setTimeouts, а оскільки setTimeout повертає "останній інтервал або час очікування створено + 1", а оскільки top.clearInterval все ще доступний, це переможе атаки чорної шапки на кадр веб-сайти, описані вище.

Використовуйте htaccess, щоб уникнути набору кадрів із високим рівнем доступу, iframe та будь-якого вмісту, такого як зображення.

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^http://www\.yoursite\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule ^(.*)$ /copyrights.html [L]

Це покаже сторінку авторських прав замість очікуваної.