User Tools

Site Tools

Trace:

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision		Previous revision
programmieren:javascript:e-mail-adresse_spam_schutz [2022/12/18 13:20] – created jgehrkeprogrammieren:javascript:e-mail-adresse_spam_schutz [2024/07/31 10:59] (current) – [Alternative Version] jgehrke
Line 1: Line 1:
 ====== Spam-Schutz für E-Mail Adressen mit Javascript ====== ====== Spam-Schutz für E-Mail Adressen mit Javascript ======
 +
 +Dieser Javascript Code wird ausgeführt nach dem die Seite geladen wurde. Wartet 1,5 Sekunden und wandelt dann jeden HTML-Link in einen E-Mail-Adressen Link um. So fern dieser Link das Attribute ''data-mail-b64'' hat und eine Base65 enkodierte E-Mail-Adresse enthält. Ziel ist es, dass Spam-Bots, die nach E-Mail Adressen suchen, weder Javascript ausführen, noch 1,5 Sekunden auf einer Seite warten. 
  
 **Der HTML Code fürs Frontend** **Der HTML Code fürs Frontend**
Line 11: Line 13:
  /* Timeout, bis Mail Links gerendert werden */  /* Timeout, bis Mail Links gerendert werden */
  const timeout = 1500; /* in ms */  const timeout = 1500; /* in ms */
 + const mail_b64_attr_name = 'data-mail-b64'; /* Attribut, das jeder E-Mail Link haben muss */
  
  on_ready( wait_to_build_mail_links );  on_ready( wait_to_build_mail_links );
Line 22: Line 25:
  /* Ändern der Links zu Mail-Links */  /* Ändern der Links zu Mail-Links */
  function build_mail_links(){  function build_mail_links(){
- const mail_b64_attr_name = 'data-mail-b64'; 
  const mail_node_selector = 'a['+mail_b64_attr_name+']';  const mail_node_selector = 'a['+mail_b64_attr_name+']';
  const mail_anchor_nodes  = document.querySelectorAll(mail_node_selector);  const mail_anchor_nodes  = document.querySelectorAll(mail_node_selector);
Line 43: Line 45:
  }  }
 }()) }())
 +</code>
 +
 +====== Alternative Version ======
 +
 +Mit diesem Code-Schnipsel wird kein <a>-Tag benötigt. es wird hinter dem Script einfach neu eingefügt. Der Code ist ein bisschen kürzer, dafür nicht ganz so breit anwendbar, da immer ein komplettes Script platziert werden müsste.
 +
 +<code javascript>
 +<script type="text/javascript">
 +/*
 + Fügt ein <a href="mailto:...">...</a> hinter diesem Script direkt ein, nach der Ausführung.
 +*/
 +(function(){
 + const node_this_script = document.currentScript;
 + const new_mail_node    = document.createElement('a');
 + const mail_as_b64      = 'aW5mb0A0c29mdC5kZQ=='; // encoded E-Mail Adressen mit btoa('email adresse')
 + const mail_href        = 'mailto:' + atob(mail_as_b64);
 + const mail_label       = atob(mail_as_b64);
 +
 + new_mail_node.textContent  = mail_label;
 + new_mail_node.setAttribute( 'href', mail_href );
 + node_this_script.after( new_mail_node );
 +}())
 +</script>
 </code> </code>
programmieren/javascript/e-mail-adresse_spam_schutz.1671369642.txt.gz · Last modified: 2022/12/18 13:20 by jgehrke
CC Attribution-Share Alike 4.0 International Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International

Page Tools