Nginx: Hotlink-skydd via omskrivning

Eller: hur du kan straffa bildtjuvar!

Nästan alla som driver en webbplats med redaktionellt innehåll på Internet känner till detta: bildstöld via hotlink.
Och helst med en helt kopierad text som du har gjort noggranna efterforskningar om och lagt ner timmar på att skriva ner och korrekturläsa.

Denna artikel uppdaterades senast den 14 april 2022.

info
Skrivet av Saskia Teichmann
den 31 januari 2016
Sändning
Användarrecension
5 (1 rösta)
Kommentarer Betyg 0 (0 recensioner)
Hotlink-skydd ∙ Skydda media ∙ nginx
Nginx: Anleitung - Hotlink-Schutz konfigurieren

Det finns inte ens en backlink till din egen webbplats, såvida inte innehållstjuven helt enkelt har kopierat och klistrat in hela innehållet från källkoden till sin webbplats. Då kan det hända att du har länkat någonstans till ett annat av dina egna inlägg med den fullständiga webbadressen. Och den här länken finns då fortfarande i texten. Men ta först ett djupt andetag och börja med det viktigaste:

Vad är en hotlink egentligen?

En hotlink är t.ex. integrering av en bild via en direktlänk till den befintliga URL:en. Utan att ladda ner bilden i förväg, ladda upp den på ditt eget webbutrymme eller server och sedan länka den därifrån.

Hotlinks är inte generellt dåliga. Åtminstone inte om man har kommit överens om hotlinking med varandra eller om man är en tjänst för uppladdning av bilder.
I de flesta fall är du dock inte en bilduppladdningstjänst, utan helt enkelt någon som betalar för sitt webbhotell varje månad och har en viss trafikgräns. Och här kommer vi till kärnan i frågan.
Om någon annan visar mediefiler på sin hemsida som är lagrade på din webbserver, serverar din server var och en av dessa förfrågningar från tredje part eftersom det är vad servrar gör. De serverar (serverar, tillhandahåller, serverar, serverar).

Nu har innehållstjuven en gratis bild på sin webbplats för vilken ingen trafik genereras/debiteras på hans egen server. Denna trafik (serverbelastning) faktureras tjuven, dvs. dig, och kostar serverresurser varje gång en besökare surfar till innehållstjuvens webbplats och bilden visas i deras webbläsare.
Under vissa omständigheter kan detta leda till otrolig extern trafik. Beroende på hur mycket besökartrafik innehållstjuven har på sin webbplats.
Det är verkligen inte roligt.

Idag vill jag visa dig hur du kan konfigurera din egen NGINX-webbserver så att den inte hanterar dessa externa förfrågningar som förväntat, utan istället ger besökarna på innehållstjuvens webbplats en annan bild.
På så sätt kan du återställa den förmodade skadan och dra nytta av den och, om du är riktigt arg, kan du få ett övertag på tjuven: locka besökare till din egen webbplats!

Hur man gör NGINX till en oövervinnlig Hotlink-chef!

Så här ser planen ut:

  • Vi vill ha en heltäckande lösning som fungerar för alla domäner. Så att du inte behöver anpassa varje enskild vHost-konfiguration (tillgängliga webbplatser).
  • Länken till begäran bör skrivas om (skriva om) och därmed serveras en specifik, annorlunda bild till tjuvens sida istället
  • Det måste fungera med Google Image Search och andra sökmotorer med en bildsökningsfunktion istället för att förbjuda hotlinking över hela linjen. Annars kommer dina faktiska bilder inte längre att visas i Google Image Search, utan bara utbytesbilden

Lösning på bildstölden

Dessa få rader kod är i slutändan lösningen på problemet med bildstöld. Hur och var du ska placera koden kan du läsa om i nästa avsnitt.

plats ~* \.(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 av;
  log_not_found av;
  expires max;
  valid_referers none blocked ~.google. ~.bing. ~.yahoo. ~.yandex. server_namn ~($host);
    if ($invalid_referer) {
      rewrite (.*) /hotlink/eight-content-and-image-stealing.png omdirigering;
      }
}
#hotlink avsluta omdirigeringsslingan
location = /hotlink/acht-inhalts-und-bilderklau.png { }

Vad gör koden?

~ används för att ta hänsyn till stora/små bokstäver, medan ~* Skiftlägeskänsliga ignoreras.

NGINX kontrollerar platsregeln i den ordning som de reguljära uttrycken infogas. Detta innebär att instruktionerna för cachningshuvudet för mediefiler och instruktionerna för vårt hotlink-skydd måste finnas i samma block!

location = /hotlink/åttonde innehållet-och-bildstöld.png { } krävs för att den nya begäran om ersättningsbilden inte ska leda till en oändlig vidarebefordringsloop:
Bildtjuvens webbplats skickar begäran om bildA → vår NGINX omdirigerar begäran om ersättningsbild → bildtjuvens webbplats skickar begäran om ersättningsbild → vår NGINX omdirigerar begäran om ersättningsbild, men serverar inte → och så vidare...

Platzhalterbild bei Bilderdiebstahl

1TP4Host är en variabel som gör att denna instruktion kan användas globalt och fungerar under alla vHost-domäner på webbservern. Följande URL är giltig för varje domän: http://$host/hotlink/achtung-inhalts-und-bilderklau.png

Endast katalogen /hotlink och en bildfil med namnet: uppmärksamhet-innehåll-och-bildstöld.png ska lagras i denna katalog. Du kan också namnge filen och katalogen på annat sätt om du vill. Anpassa bara koden i enlighet med detta.

Hur man integrerar platsregeln

Så här går du tillväga för att utrusta din NGINX-webbserver med detta speciella hotlink-skydd mot bildstöld.

Total tid: 30 minuter

Förberedelser: Skapa och ladda upp utbytesgrafik

Skapa först en grafik som besökare på tjuvens webbplats ska se och ladda upp den till önskad katalog på din webbserver. Anteckna webbadressen till grafiken.

NGINX Webserser-platser Anpassa konfigurationen

På servern navigerar du till katalogen /etc/nginx/common/ och letar reda på konfigurationen för platser som ingår i serverblocket för din vhost, som innehåller regler för den plats som definieras i koden ovan. Som regel kommer det redan att finnas ett befintligt regelblock för den angivna platsen. Om så inte är fallet infogar du bara ovanstående kod som ett nytt regelblock i rätt fil.
Om blocket redan finns, infoga endast ovanstående regler utan platsomslaget.

Spara och ladda om NGINX webbserverkonfiguration

Spara sedan konfigurationsfilen med det utökade platsblocket på servern och testa den nya konfigurationen först via SSH-terminalen med nginx -t
Om testet går utan problem startar du om din NGINX med kommandot service nginx restart.

Testa ditt hotlink-skydd!

Här har jag skrivit ett verktyg som du kan använda för att testa din konfiguration för hotlinkskydd. Ange den direkta URL:en för en grafik på din nginx-server i inmatningsfältet. Helst ska din ersättningsbild sedan visas i utdatafältet nedan. Om bilden från den angivna URL:en visas måste du kontrollera ditt hotlink-skydd igen.

Om du vill köra testet flera gånger i följd för samma bild-URL måste du tömma webbläsarens cache efter varje test och ladda om den här sidan.

Kontrollera bildens URL

Har du fortfarande frågor? Tveka då inte att använda kommentarsfunktionen under den här artikeln!

Dela gärna den här artikeln på din Facebook-sida, Twitter, Google+ eller någon annan valfri social plattform. Du hittar delningsknapparna nedan. Det är snabbt och enkelt att dela och jag skulle verkligen uppskatta det.

<span class="castledown-font">Saskia Teichmann</span>

Saskia Teichmann

Saskia Teichmann är certifierad AI-expert (MMAI®), snart medlem i German AI Association samt WooCommerce-specialist och WordPress-utvecklare. Hon hjälper små och medelstora företag och industrin att integrera AI, GDPR, EU:s AI-förordning och modern webbteknik i en framtidssäker och rättssäker digital strategi.

Skicka in en projektförfråganServera kaffe

9 Kommentarer

  1. Kuwe

    Supergenialt inlägg! Idén är verkligen enkel 🙂 Jag tycker att den är jättebra. Tyvärr har jag aldrig tänkt så långt tidigare, då detta aldrig har varit ett problem för mig (kan vara innehållet ;)).
    Jag är också mycket förvånad över att läsa något om Nginx-konfiguration på en frontend / designsida. WordPress är också mer inställd på Apache, även om vissa plugins nu också stöder Nginx mer och genererar konfigurationer för det istället för att bara skapa en Apache htaccess 😉

    Btw. Jag tycker att dina mönster är fantastiska också! *båda tummen upp* 🙂

    Svara
    • Saskia Lund

      Tack för denna fantastiska feedback!

      För att vara ärlig tror jag att nginx är den „bättre“ och snabbare webbservern i kombination med WordPress. Gör bara lite googling på ämnet 🙂

      Till front-end-kommentaren:
      Jag är en frontend-utvecklare, men eftersom jag är specialiserad på WordPress finns det i mina ögon ingen väg runt php, och vid någon tidpunkt finns det ingen väg runt serverrelaterade problem.

      Stort tack igen!

      Svara
  2. Frank

    Bra artikel! Var exakt ska koden placeras? I htaccess i roten till webbplatsen? Eller i en separat htaccess i bildkatalogen? Tack så mycket!

    Svara
    • Saskia Lund

      Hej Frank!

      Om du använder en nginx-webbserver används inte .htaccess; med andra ord kan en nginx-webbserver inte göra någonting med .htaccess-filer.

      .htaccess-filer används i samband med Apache-webbservrar.

      Ovanstående kod används vanligtvis globalt i filen locations.conf för en nginx-webbserver i serverkatalogen /etc/nginx/common/.
      Det är viktigt att ta en närmare titt på din egen serverkonfiguration i locations.conf. Om det redan finns en locations-regel för den ovan nämnda platsen måste du anpassa den med hjälp av koden ovan, annars är det som sagt bara att infoga, spara och sedan köra den nya nginx-konfigurationen med hjälp av terminalkommandot nginx -t Kontrollera kortfattat. Om nginx i terminalen rapporterar tillbaka att allt är tutti, kan du använda tjänst nginx omstart Starta om webbservern för att läsa in den nya konfigurationen.

      Lycka till!

      Svara
  3. Frank

    Tack och ledsen ... Jag hade förbisett Nginx i titeln. Jag letar efter ett fungerande hotlink-skydd för min Magento-butik på en Apache, helst utan Google-påföljder.

    Svara
    • Saskia Lund

      Hej Frank!

      För en Apache-motsvarighet kan du försöka lägga till följande i din .htaccess-fil i rotkatalogen på din webbplats:

      1:a varianten (om du generellt vill förbjuda hotlinking av bildfiler, men vill tillåta hotlinking för vissa domäner (t.ex. google.*, bing.*, yahoo.*, yandex.*, duckduckgo.*, etc.):

      RewriteEngine på
      # Ta bort följande rad om du även vill blockera tomma refererande webbadresser:
      RewriteCond %{HTTP_REFERER} !^$
      
      RewriteCond %{HTTP_REFERER} !^https?://(.+\.)?yourdomain.com [NC]
      RewriteRule \.(jpe?g|png|gif|bmp)$ - [NC,F,L]
      
      # Om du nu vill visa en ersättningsbild istället för den faktiska hotlinkade bilden, ersätter du ovanstående regel enligt följande:
      # RewriteRule \.(jpe?g|png|gif|bmp) http://deinedomain.de/blocked.png [R,L]
      
      # Tillåt hotlinking från följande webbplatser (domäner)
       RewriteCond %{HTTP_REFERER} !^https?://(www\.)?google\.com/.*$ [NC]

      2. om du bara vill blockera hotlinking för vissa referenser (dåliga domäner):

      RewriteEngine på
      RewriteCond %{HTTP_REFERER} ^https?://(.+\.)?schlingel1\.com [NC,OR]
      RewriteCond %{HTTP_REFERER} ^https?://(.+\.)?schlingel2\.com [NC,OR]
      RewriteRule \.(jpe?g|png|gif|bmp)$ - [NC,F,L]
      
      # Om du nu vill visa en ersättningsbild istället för den faktiska hotlinkade bilden, ersätter du ovanstående regel enligt följande:
      # RewriteRule \.(jpe?g|png|gif|bmp) http://deinedomain.de/blocked.png [R,L]

      Jag hoppas att detta hjälper dig

      Bästa hälsningar
      Saskia

      Svara
  4. Müller

    Vem känner till ett hotlink-skydd för bmbfotos.com?
    ingenting fungerar för den här sidan

    Svara
    • Saskia Lund

      Hej „Müller“!
      Vilka bilder på den ovan nämnda webbplatsen är till exempel hotlinkade?
      Kanske kan de hjälpa dig vidare.

      Bästa hälsningar
      Saskia Lund

      Svara
  5. Ralph

    Är det möjligt att blockera endast en domän? Genom att skriva om?

    Svara

Skicka en kommentar

Din e-postadress kommer inte publiceras. Obligatoriska fält är märkta *

Sändning