Содржина Маркетинг

Кршење на фрејмови: Како да го запрете неовластеното ифрамирање на вашата содржина

Еден посетител на мојата страница еднаш ме информираше кога кликна на една од моите врски Twitter; тој беше донесен на мојата страница со голем скокачки прозорец и предупредување за злонамерен код. Тоа е доволно за да се исплаши некого, па почнав да правам некои тестирања. Немаше ништо лошо со мојот сајт - проблемот беше врската.

Врската на друга локација создаде лента со алатки нагоре што ги охрабрува луѓето да кликнат на злонамерна врска додека ја вчитуваат мојата страница во iframe одоздола. За повеќето луѓе, мојата страница може да изгледа дека шири злонамерен код. Не би рекол дека ми се допаѓа која било локација што ја вчитува мојата страница во iframe, па го направив она што би го направил секој разумен гик... Вчитав прекинувач на рамки.

Меѓутоа, ако го поставите вашиот сајт со рамка, не е секогаш злонамерно. Неодамна споделивме алатка, Снајперски, за да додадете повик за акција (CTA) до која било врска на веб-локација што ја споделувате. Тоа го прави со вградување на целата ваша локација во iframe и примена на div над вашата содржина со повик за акција.

Но, јас сум прилично специфичен за мојата содржина и напорот што го вложив Martech Zone, затоа не сакам никој да ја обликува мојата содржина, дури и со платформа за споделување врски. Во вршењето на некои истражувања, постојат неколку начини да се справите со ова.

Како да престанете да ја врамите вашата содржина со JavaScript

Овој код на JavaScript проверува дали тековниот прозорец (self) не е највисокиот прозорец (top). Ако не е, тоа значи дека страницата е во рамка, iframe или слично, а скриптата го пренасочува најгорниот прозорец кон URL на тековниот прозорец. Ова ефикасно избива на iframe.

<script type='text/javascript'>
if (top !== self) top.location.href = self.location.href;
</script>

Постојат неколку негативни страни на овој пристап:

  1. Потпирање на JavaScript: Ако корисникот има оневозможено JavaScript, овој метод нема да работи.
  2. Одложувања: Може да има мало доцнење пред да се изврши JavaScript, при што сè уште може да биде видлива врамената верзија на вашата страница.
  3. Ограничувања за вкрстено потекло: Во некои ситуации, политиката за исто потекло може да спречи оваа скрипта да работи како што е предвидено. Ако родителскиот документ е на друг домен, можеби нема да може да пристапи top.location.href.
  4. Потенцијал за Frame-Busting-Busters: Постојат и скрипти (наречени frame-busting-busters) кои можат да спречат функционирање на скриптите за разбивање рамки.

Подобриот пристап е да се користат заглавија на одговор HTTP.

X-Frame-Options и Content-Security-Policy

Двете X-Frame-Options Content-Security-Policy (CSP) се заглавија на одговор на HTTP кои се користат за подобрување на безбедноста на веб-локацијата. Секој од нив има малку различни цели и има различни нивоа на флексибилност.

X-Frame-Options е постар заглавие на HTTP специјално дизајниран да контролира дали вашата страница може да биде вградена во a <frame>, <iframe>, <embed>или <object> на друг сајт. Има три можни директиви:

  1. DENY – Страницата не може да се прикаже во рамка, без оглед на тоа што страницата се обидува да го стори тоа.
  2. SAMEORIGIN – Страницата може да се прикаже само во рамка со исто потекло како и самата страница.
  3. ALLOW-FROM uri – Страницата може да се прикаже само во рамка на наведеното потекло.

Сепак, X-Frame-Options е ограничен по тоа што не може да се справи со посложени сценарија, како што се дозволува кадрирање од повеќе различни потекла или користење џокери за поддомени. Не сите прелистувачи го поддржуваат ALLOW-FROM директивата.

Content-Security-Policy, од друга страна, е многу пофлексибилен и помоќен HTTP заглавие. Додека може да направи сè X-Frame-Options може да направи и многу повеќе, нејзината примарна цел е да спречи широк опсег на напади со вбризгување код, вклучително и скриптирање меѓу страници (XSS) и кликнување. Работи со одредување бела листа на доверливи извори на содржина (скрипти, стилови, слики, итн.).

За контролирање на рамки, CSP користи frame-ancestors директива. Можете да наведете повеќе извори, вклучително и повеќе домени и поддомени со знаци. Еве еден пример:

cssCopy codeContent-Security-Policy: frame-ancestors 'self' yourdomain.com *.domain2.com;

Ова ќе овозможи страницата да биде врамена на сопствената локација ('self'), на yourdomain.com, и на кој било поддомен на domain2.com.

CSP се препорачува како замена за X-Frame-Options, бидејќи може да се справи со сè X-Frame-Options може да направи, и многу повеќе. Додека повеќето модерни прелистувачи поддржуваат CSP, сепак може да има некои стари или помалку вообичаени прелистувачи кои не го поддржуваат целосно.

Како да престанете да ја обликувате вашата содржина со HTML

Сега постои мета-ознака Content-Security-Policy што може да се распореди што ја оневозможува можноста за iframe на вашата содржина:

<meta http-equiv="Content-Security-Policy" content="frame-ancestors 'self' yourdomain.com">

Ефективноста на мета-ознаката HTML е ограничена бидејќи не сите прелистувачи го почитуваат Content-Security-Policy кога се поставува со помош на мета-ознака.

Како да престанете да ја врамите вашата содржина со HTTP заглавија

Подобро е да ги користите заглавјата на HTTP X-Frame-Options or Content-Security-Policy за контрола на кадрирањето. Овие опции се посигурни и побезбедни и работат дури и ако JavaScript е оневозможен. Методот JavaScript треба да се користи само како последно средство ако немате контрола врз серверот за да поставувате заглавија на HTTP. За секој пример, заменете yourdomain.com со вашиот вистински домен.

Apache-то – Изменете ја вашата .htaccess датотека како што следува:

Header always set X-Frame-Options SAMEORIGIN
Header always set Content-Security-Policy "frame-ancestors 'self' yourdomain.com"

Nginx – Изменете го блокот на вашиот сервер на следниов начин:

add_header X-Frame-Options SAMEORIGIN;
add_header Content-Security-Policy "frame-ancestors 'self' yourdomain.com";

IIS – направете го тоа со додавање на следново на вашиот web.config датотека:

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="Content-Security-Policy" value="frame-ancestors 'self' yourdomain.com" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

WordPress – направете го тоа со додавање на овој код во датотеката functions.php:

function add_security_headers() {
  header('X-Frame-Options: SAMEORIGIN');
  header("Content-Security-Policy: frame-ancestors 'self' yourdomain.com");
}
add_action('send_headers', 'add_security_headers');

Овие конфигурации ќе овозможат вашата страница да биде вградена само во iframes на точниот домен што ќе го наведете, а не на какви било поддомени на домен. Ако сакате да дозволите одредени поддомени, ќе треба да ги наведете експлицитно, како subdomain1.yourdomain.com subdomain2.yourdomain.com, и така натаму.

Дозволете Ифрамирање на вашата содржина од повеќе домени

Можете да наведете повеќе домени со заглавието на одговорот на HTTP Content-Security-Policy и директивата рамка-предци. Простор треба да го оддели секој домен. Еве еден пример:

Content-Security-Policy: frame-ancestors 'self' domain1.com domain2.com domain3.com;

Apache-то – Изменете ја вашата .htaccess датотека како што следува:

Header always set X-Frame-Options SAMEORIGINHeader always set Content-Security-Policy "frame-ancestors 'self' domain1.com domain2.com domain3.com"

Nginx – Изменете го блокот на вашиот сервер на следниов начин:

add_header X-Frame-Options SAMEORIGIN;add_header Content-Security-Policy "frame-ancestors 'self' domain1.com domain2.com domain3.com";

IIS – направете го тоа со додавање на следново на вашиот web.config датотека:

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="SAMEORIGIN" />
      <add name="Content-Security-Policy" value="frame-ancestors 'self' domain1.com domain2.com domain3.com" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

Дозволете ифрамирање на вашата содржина од домен со џокер

Можете исто така да наведете џокер за сите поддомени со Content-Security-Policy Заглавие за одговор на HTTP и директивата рамка-предци. Еве примери на Content-Security-Policy код што треба да се ажурира:

Content-Security-Policy: frame-ancestors 'self' *.yourdomain.com;

Apache-то – Изменете ја вашата .htaccess датотека како што следува:

Header always set Content-Security-Policy "frame-ancestors 'self' *.yourdomain.com"

Nginx – Изменете го блокот на вашиот сервер на следниов начин:

add_header Content-Security-Policy "frame-ancestors 'self' *.domain1.com *.domain2.com *.domain3.com";

IIS – направете го тоа со додавање на следново на вашиот web.config датотека:

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="Content-Security-Policy" value="frame-ancestors 'self' *.yourdomain.com" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

Douglas Karr

Douglas Karr е CMO на OpenINSIGHTS и основачот на Martech Zone. Даглас им помогна на десетици успешни стартапи на MarTech, помогна во длабинската анализа од над 5 милијарди американски долари за аквизиции и инвестиции на Martech и продолжува да им помага на компаниите во имплементацијата и автоматизирањето на нивните стратегии за продажба и маркетинг. Даглас е меѓународно признат експерт и говорник за дигитална трансформација и MarTech. Даглас е исто така објавен автор на водич за Dummie и книга за бизнис лидерство.

поврзани написи

Вратете се на почетокот копче
Затвори

Откриен е блок за рекламирање

Martech Zone може да ви ја обезбеди оваа содржина без трошоци бидејќи ја монетизираме нашата страница преку приходи од реклами, врски со партнери и спонзорства. Ќе ни биде благодарно ако го отстраните вашиот блокатор на реклами додека ја гледате нашата страница.