Hallo

Zunächst möchte ich Sie herzlich Willkommen heißen und mich vorstellen: mein Name ist Saskia Lund und ich bin Front-End Entwicklerin. Auf diesen Seiten finden Sie nützliche Informationen zu den Themen "Webdesign", Ecommerce in Deutschland und WordPress. Außerdem trage ich Tipps und Tricks rund um HTML5, CSS3 und JavaScript / jQuery für Sie zusammen.

Ich freue mich, dass Sie da sind und meine Beiträge lesen. Vielen Dank!

Saskia Lund

Aktuelle Projekte

Fertiggestellt: Microsite zum Reiseziel Ras Al Khaimah für Qatar Airways

Fertiggestellt: Qatar Airways

Neues im Blog

Leserstimmen

Kontakt

SL IT&WEBDESIGN
Saskia Lund

Heerstr. 35
30890 Barsinghausen

   +49 5105 591 4002
  +49 322 233 930 94
  mail@saskialund.de

- Öffnungszeiten nach Vereinbarung -

Nginx: Anleitung - Hotlink-Schutz konfigurieren
31.Januar 2016

Nginx: Hotlink-Schutz per Rewrite Oder: wie Sie die Bilderdiebe abstrafen können!


Fast jeder, der im Internet eine Website mit redaktionellen Inhalten betreibt kennt das: Bilderklau per Hotlink. Und dann am Besten noch mitsamt komplett kopiertem Text, den man mühevoll recherchiert und stundenlang aufgeschrieben und korrekturgelesen hat.

Nicht mal ein Backlink zur eigenen Website ist vorhanden, es sei denn der Content-Dieb hat den kompletten Inhalt einfach per Copy & Paste aus dem Quelltext in seine Website kopiert. Dann kann es schonmal vorkommen, dass man da irgendwo auf einen anderen eigenen Beitrag mit vollständiger URL verlinkt hat. Und dieser Link ist dann noch im Text enthalten.

Was ist ein Hotlink eigentlich?

Ein Hotlink ist zum Beispiel die Einbindung eines Bildes per direkter Verlinkung auf die vorhandene URL. Ohne das Bild zuvor herunterzuladen, es auf einen eigenen Webspace oder Server hochzuladen und es dann von dort zu verlinken.

Hotlinks sind nicht generell schlimm. Zumindest nicht, wenn das Hotlinking miteinander abgesprochen wurde oder wenn man ein Bilder-Uploadservice ist.
In den meisten Fällen ist man jedoch kein Bilder-Uploadservice, sondern einfach nur jemand, der sein Webhosting jeden Monat brav bezahlt und ein bestimmtes Trafficlimit hat. Und hier kommen wir auch schon zum Kern des Pudels.
Lässt nun jemand Fremdes Mediendateien auf seiner Homepage anzeigen, die auf Ihrem Webserver liegen, bedient Ihr Server jede dieser Fremd-Anfragen, weil das das ist was Server eben machen. Sie serven (dienen, leisten, servieren, bedienen).

Nun hat der Content-Dieb gratis ein Bild auf seiner Website, für das auf seinem eigenen Server kein Traffic erzeugt/berechnet wird. Dieser Traffic (Serverlast) wird dem Bestohlenen, also Ihnen weiter berechnet und kostet Serverressouren: und zwar jedes Mal, wenn ein Besucher auf die Content-Dieb-Seite surft und in seinem Webbrowser das Bild angezeigt wird.
Unter Umständen kann so etwas zu unglaublichem Fremdtraffic führen. Je nachdem wieviel Besuchertraffic der Content-Dieb auf seiner Website hat.
Das ist echt nicht witzig.

Ich möchte Ihnen heute zeigen, wie man den eigenen nginx Webserver so konfigurieren kann, dass er diese Fremdanfragen nicht wie erwartet bedient, sondern stattdessen den Besuchern der Content-Dieb-Website ein anderes Bild serviert.
So können Sie nämlich den vermeintlichen Schaden umkehren und daraus Nutzen ziehen und falls Sie richtig sauer sind, dem Dieb noch eins auswischen: holen Sie die Besucher auf Ihre eigene Website!

Wie Sie nginx zum unbezwingbaren Endgegner machen!

So sieht der Plan aus:

  • Wir wollen eine übergreifende Lösung, die für alle Domains funktioniert. So, dass man nicht jede einzelne vHost Konfiguration (sites-available) anpassen muss.
  • Es soll der Anfragelink umgeschrieben (rewrite) und so stattdessen ein bestimmtes, anderes Bild an die Diebesseite bedient werden
  • Es muss mit Google Bildersuche und anderen Suchmaschinen mit Bildersuchfunktion funktionieren, anstatt das Hotlinking pauschal zu verbieten. Ansonsten werden in der Google Bildersuche nicht mehr Ihre eigentlichen Bilder angezeigt, sondern immer nur das Austausch-Bild
Lösung
location ~* \.(ogg|ogv|svg|svgz|eot|otf|woff|mp4|ttf|css|rss|atom|js|jpg|jpeg|gif|png|ico|zip|tgz|gz|rar|bz2|doc|xls|exe|ppt|tar|mid|midi|wav|bmp|rtf|swf)$ {
  add_header "Access-Control-Allow-Origin" "*";
  access_log off;
  log_not_found off;
  expires max;
  valid_referers none blocked ~.google. ~.bing. ~.yahoo. ~.yandex. server_names ~($host);
    if ($invalid_referer) {
      rewrite (.*) /hotlink/achtung-inhalts-und-bilderklau.png redirect;
      }
}
#hotlink weiterleitungsloop beenden
location = /hotlink/achtung-inhalts-und-bilderklau.png { }

Was macht der Code?
~ wird verwendet, um Groß-/Kleinschreibung zu berücksichtigen, während ~* Groß-/Kleinschreibung ignoriert.

nginx überprüft die locations-Regel in der Reihenfolge, in der die regulären Ausdrücke eingefügt sind. Das bedeutet, dass sich die Caching Header-Anweisungen für Mediendateien und die Anweisungen unseres Hotlink-Schutzes im selben Block befinden müssen!

location = /hotlink/achtung-inhalts-und-bilderklau.png { } wird benötigt, damit bei der neuen Anfrage auf das Austauschbild, kein unendlicher Weiterleitungsloop entsteht:
Bilderdiebseite sendet Anfrage für BildA → unser nginx leitet die Anfrage nach Austauschbild um → Bilderbiebseite sendet Anfrage für Austauschbild → unser nginx leitet die Anfrage nach Austauschbild um, servt aber nicht → und so weiter…

$host ist eine Variable, die diese Anweisung global nutzbar macht und unter allen vHost-Domains auf dem Webserver funktioniert. Folgende URL wird für jede Domain gültig ausgegeben:
http://$host/hotlink/achtung-inhalts-und-bilderklau.png
Beispiel für ein Austauschbild bei unerlaubtem Hotlinking - Hotlink Schutz per nginx rewriteEs sollte lediglich unter jeder Domain das Verzeichnis /hotlink angelegt werden und eine Bilddatei mit dem Namen: achtung-inhalts-und-bilderklau.png in diesem Verzeichnis abgelegt werden. Sie können die Datei und das Verzeichnis auch anders nennen, wenn Sie möchten. Passen Sie nur den Code entsprechend an.

Speichern Sie die Konfigurationsdatei mit dem erweiterten locations-Block auf dem Server ab und starten Sie Ihren nginx neu.

Jetzt testen

Hier habe ich Ihnen ein Tool geschrieben, mit dem Sie Ihre Hotlink-Schutz-Konfiguration testen können. Geben Sie in das Eingabefeld die direkte URL für eine Grafik auf Ihrem nginx Server ein. Im Ausgabefeld darunter sollte dann im Optimalfall Ihr Austauschbild angezeigt werden. Wenn das Bild von der eingegebenen URL erscheint, müssen Sie Ihren Hotlink-Schutz nochmal kontrollieren.

Wenn Sie den Test mehrmals hintereinander für dieselbe Bild-URL machen möchten, müssen Sie Ihren Browsercache nach jedem Test löschen und diese Seite neu laden.

Bild-URL prüfen

Haben Sie noch Fragen?

Dann zögern Sie nicht und nutzen Sie die Kommentarfunktion unterhalb dieses Beitrags!

Bitte teilen Sie diesen Artikel auf Ihrer Facebook-Seite, über Twitter, Google+ oder eine andere soziale Plattform Ihrer Wahl. Weiter unten finden Sie die Teilen-Buttons. Das Teilen ist einfach und schnell und es würde mich sehr freuen.

Herzliche Grüße

Saskia Lund

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.