Class: Shugoi::Notice

Inherits:

Object

• Object
• Shugoi::Notice

Defined in:

lib/shugoi/notice.rb

Overview

Injection de la notice de consentement dans le HTML rendu. Parité avec injectNoticeScript (render.ts du module Node) : la notice est injectée dans le HTML APRÈS le split-render (elle ne disparaît pas quand le render remplace le document). L'ack est décidé côté SERVEUR via /notice (machineId), pas de cookie.

Constant Summary

SCRIPT =

Script renforcé (parité avec guard.src.js du site Node, audit §8.5.3) :

- overlay bloquant z-index max
- verrouillage scroll/wheel/touchmove tant que la notice est affichée
- MutationObserver anti-bypass COMPLET : ré-affiche la notice si elle est retirée
du DOM, et RESTAURE intégralement son style ET son innerHTML s'ils sont modifiés
(devtools / manipulation JS du style, des attributs, du texte, du contenu).
L'overlay est reconstruit à partir du template si un élément clé manque.
- obligation d'accepter (bouton OK) pour déverrouiller — l'ack est serveur (mid).

Les placeholders mid et sk sont remplacés à l'injection.

<<~'JS'
  <script>
  (function(){
    var mid=window.__sg_mid||'';
    var sk=window.__sg_siteKey||'';
    if(!mid||!sk||window.__sg_noticeEnabled===false)return;
    var base=window.__sg_baseUrl||'';
    var origin=base.replace(/\/api\/v1\/?$/,'');
    var _OVERLAY_CSS='position:fixed!important;inset:0!important;z-index:2147483647!important;background:rgba(0,0,0,.6)!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:1.2rem!important';
    var _CARD_CSS='background:#fff!important;border:4px solid #000!important;border-radius:28px 6px 32px 10px!important;box-shadow:14px 14px 0 #000!important;padding:0!important;max-width:720px!important;width:100%!important;text-align:center!important;font-family:Arial,sans-serif!important;display:flex!important;overflow:hidden!important';
    var _CARD_HTML='<div style="flex:0 0 320px;display:flex;align-items:center;justify-content:center;padding:1.5rem 1rem 1.5rem 3rem;overflow:hidden"><img src="'+origin+'/favicon.png" alt="" style="width:100%;height:auto;max-width:220px;pointer-events:none"></div><div style="flex:1;padding:1.6rem 1.8rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center"><img src="'+origin+'/brand-block.png" alt="Shugoi" style="display:block;margin:0 0 .3rem;pointer-events:none;max-width:100%;height:auto;max-height:40px"><div style="border:2px solid #000;display:inline-block;border-radius:8px 2px 12px 4px;padding:.2rem .6rem;font-size:.5rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#E87090;margin-bottom:.6rem">Protection anti-abus</div><p style="font-size:.8rem;color:#555;line-height:1.7;margin:0 .4rem .6rem;max-width:280px">Ce site utilise Shugoi pour se protéger contre les abus et la fraude. Des caractéristiques techniques de votre navigateur sont analysées pour détecter les scripts automatisés, Tor, les VPN et les environnements virtuels. Aucune donnée personnelle n\\'est collectée.</p><button id="__sg_ok" style="background:#E87090;color:#fff;border:3px solid #000;border-radius:12px 3px 14px 5px;padding:.35rem 1.4rem;font-size:.8rem;font-weight:700;cursor:pointer">OK</button><div style="margin-top:.5rem;font-size:.5rem;color:#ccc"><a href="'+origin+'/legal/shugoi-notice" target="_blank" style="color:#E87090;text-decoration:underline">En savoir plus · shugoi.com</a></div></div>';
    function ack(){try{fetch(base+'/notice',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({machineId:mid,siteKey:sk}),keepalive:true,signal:AbortSignal.timeout(4000)}).catch(function(){})}catch(e){}}
    function buildOverlay(){
      var o=document.createElement('div');o.id='__sg_o';o.style.cssText=_OVERLAY_CSS;
      var c=document.createElement('div');c.id='__sg_cd';c.style.cssText=_CARD_CSS;
      c.innerHTML=_CARD_HTML;
      o.appendChild(c);return o;
    }
    function okHandler(keepMo){ack();var el=document.getElementById('__sg_o');if(el&&el.parentNode)el.parentNode.removeChild(el);document.body.style.overflow='';document.documentElement.style.overflow='';if(keepMo===true){try{mo.disconnect()}catch(e){}}}
    function rebindOk(){var b=document.getElementById('__sg_ok');if(b)b.onclick=function(){okHandler(true)};}
    function enforce(){
      var o=document.getElementById('__sg_o');
      if(!o){
        document.documentElement.appendChild(buildOverlay());
        document.body.style.overflow='hidden';document.documentElement.style.overflow='hidden';
        rebindOk();return;
      }
      if(o.style.cssText!==_OVERLAY_CSS)o.style.cssText=_OVERLAY_CSS;
      var c=document.getElementById('__sg_cd');
      if(!c){
        // card supprimée → reconstruit l'overlay entier
        var fresh=buildOverlay();o.innerHTML='';o.appendChild(fresh.childNodes[0]);
        document.body.style.overflow='hidden';document.documentElement.style.overflow='hidden';rebindOk();return;
      }
      if(c.style.cssText!==_CARD_CSS)c.style.cssText=_CARD_CSS;
      if(c.innerHTML!==_CARD_HTML){c.innerHTML=_CARD_HTML;rebindOk();}
      if(document.body.style.overflow!=='hidden')document.body.style.overflow='hidden';
      if(document.documentElement.style.overflow!=='hidden')document.documentElement.style.overflow='hidden';
    }
    var mo=null;
    function show(){
      document.documentElement.appendChild(buildOverlay());
      var sp=window.scrollY||window.pageYOffset||0;
      document.body.style.overflow='hidden';document.documentElement.style.overflow='hidden';
      window.addEventListener('scroll',function(){window.scrollTo(0,sp)}, {passive:false});
      window.addEventListener('touchmove',function(e){e.preventDefault()},{passive:false});
      window.addEventListener('wheel',function(e){e.preventDefault()},{passive:false});
      rebindOk();
      mo=new MutationObserver(function(){enforce();});
      mo.observe(document.documentElement,{childList:true,subtree:true,attributes:true,characterData:true,attributeFilter:['style','class','id']});
    }
    function init(){if(document.body)show();else if(document.addEventListener)document.addEventListener('DOMContentLoaded',show);else setTimeout(init,50)}
    fetch(base+'/notice?machineId='+encodeURIComponent(mid)+'&siteKey='+encodeURIComponent(sk),{signal:AbortSignal.timeout(4000)}).then(function(r){return r.json()}).then(function(d){if(!d.acknowledged)init()}).catch(function(){init()});
  })();
  </script>
JS

Class Method Summary

• .inject(html, mid, site_key) ⇒ String

  Injecte la notice dans le HTML rendu (avant ).

Class Method Details

.inject(html, mid, site_key) ⇒ String

Injecte la notice dans le HTML rendu (avant ).

Parameters:

• html (String) —

  HTML rendu

• mid (String) —

  machineId du client

• site_key (String) —

  siteKey

Returns:

• (String) —

  HTML avec la notice injectée

# File 'lib/shugoi/notice.rb', line 80

def self.inject(html, mid, site_key)
  script = SCRIPT
    .gsub("var mid=window.__sg_mid||'';", "var mid=#{JSON.generate(mid)}||'';")
    .gsub("var sk=window.__sg_siteKey||'';", "var sk=#{JSON.generate(site_key)}||'';")
  if html.include?("</body>")
    html.sub("</body>", "#{script}</body>")
  else
    "#{html}#{script}"
  end
end