❤
npm
Sign UpSign In

advert-fetcher

0.6.3 • Public • Published

Advert Fetcher

Advert Fetcher je nástroj pro bezpečnější načítání reklamy z IM scriptu pomocí sandboxingu IM do iframu, a zobrazovaní reklamy v samostatných iframech.

Přehled architektury

Schéma komunikace:

.-----------------------.              .------------------------------.
| Advert fetcher iframe |  <-------->  | Advert fetcher worker iframe |
'-----------------------'              '------------------------------'
    ^      ^        ^
    |      |        '------------------------------.
    |      '----------------.                      |
    v                       v                      v
.-----------------.   .-----------------.   .-----------------.
| Reklamní iframe |   | Reklamní iframe |   | Reklamní iframe |
'-----------------'   '-----------------'   '-----------------'

Integrace do služby

Pokud není nutno přenastavovat interní konfiguraci advert fetcheru, integrace je poměrně přímočará:

Přidejte si advert fetcher do projektu jako npm závislost:

npm install --save-dev advert-fetcher

HTML soubory v balíčku je vhodné překopírovat do adresáře se statickými soubory. Pokud je v projektu použit gulp, postup je následovný:

gulp.task('copy:advertFetcher', () =>
    gulp
        .src('./node_modules/advert-fetcher/*.html')
        .pipe(gulp.dest('./static/html/'))
);

Nyní stačí vložit hlavní iframe advert fetcheru do stránky:

<body>
    <iframe
        id="advert-fetcher"
        width="1"
        height="1"
        sandbox="allow-scripts allow-same-origin"
        src="/static/html/advert-fetcher.html?service=...&amp;tld=...&amp;workerUrl=...">
        <!-- nepovinný fallback pokud klient nepodporuje iframy na stránce -->
        <script src="//h.imedia.cz/js/dot-small.js"></script> 
        <script src="//i.imedia.cz/js/im3.js"></script> 
        <script>
            DOT.cfg({
                service: 'název služby',
                impress: false
            });
            im.conf.server = 'i.imedia.cz';
        </script> 
    </iframe>
    ...

Query parametry ("veřejné" nastavení advert fetcheru) je popsáno níže.

Je doporučeno tento iframe skrýt v UI pomocí CSS:

#advert-fetcher {
    position: fixed;
    left: -1px;
    top: -1px;
}

Nastavení advert fetcheru

Iframe advert fetcheru vyžaduje několik nastavení poskytnutých skrz query parametry v URL iframu:

  • service - název služby, pro kterou je vydávána reklama
  • tld - top-level doména, obvykle cz, nebo test, nebo dev
  • workerUrl - URL na HTML dokument advert-fetcher-worker.html

Vložení reklamy do stránky

Pro vložení reklamy do stránky je nutno vložit do stránky iframe odkazující na dokument advert.html:

<iframe
        class="ad"
        width="..."
        height="..."
        sandbox="allow-popups allow-popups-to-escape-sandbox allow-top-navigation allow-scripts allow-same-origin"
        src="/static/html/advert.html?zoneId=...&collocation=...">
    <!-- nepovinný fallback pokud klient nepodporuje iframy na stránce -->
    <div id="ad-seznam.sluzba.zona"></div>
    <script>
        im.getAds([{
            id: 'ad-seznam.sluzba.zona',
            zoneId: 'seznam.sluzba.zona',
            collocation: '...'
        }]);
    </script> 
</iframe>

Readme

Keywords

Package Sidebar

Install

npm i advert-fetcher

Weekly Downloads

0

Version

0.6.3

License

ISC

Last publish

Collaborators

  • jurca
  • mjancarik
Try on RunKit
Report malware