How to configure anti-hotlinking for nginx website service (recommended)

1. Principle of Hotlinking

1.1 Web page preparation

Web source host (192.168.153.20) configuration

cd /usr/local/nginx/html
Transfer the preview.jpg image file to the /usr/local/nginx/html directory vim index.html
......
<img src="preview.jpg"/>
</body>
</html>

echo "192.168.153.20 www.wt.com" >> /etc/hosts
echo "192.168.153.10 www.abc.com" >> /etc/hosts

insert image description here

Hotlink website host (192.168.153.20) configuration

In order to distinguish it from the nginx service of the source host, the hotlink host can use the general wed service yum install -y httpd

vim /var/www/html/index.html
<html><body><h1>Hello! </h1>
<img src="http://www.wt.com/preview.jpg"/>     
</body></html>

echo "192.168.153.20 www.wt.com" >> /etc/hosts
echo "192.168.153.10 www.abc.com" >> /etc/hosts

systemctl restart httpd

insert image description here

1.2 Browser access verification

insert image description here

2. Configure anti-hotlinking

2.1 Modify the configuration file

vim /usr/local/nginx/conf/nginx.conf
http {
......
	server {
	......
		location ~* \.(jip|gif|swf)$ {
			valid_referers *.wt.com wt.com;
			if ( $invalid_referer ) {
				rewrite ^/ http://www.wt.com/error.png;
				#return 403;
			}
		}
	......
	}
}

~* .(jpg|gif|swf)$ : This regular expression matches case-insensitive files ending with .jpg, .gif or .swf;
valid_referers: Set trusted websites so that images can be used normally;
The following URL or domain name: The URL containing the relevant string in referer;
If statement: If the source domain name of the link is not in the list of valid_referers, and $invalid_referer is 1, the following operation is executed, that is, rewriting or returning to the 403 page.

insert image description here

Transfer the error.png image file to the /usr/local/nginx/html directory

insert image description here

2.2 Browser access verification

insert image description here

This is the end of this article about how to configure anti-hotlinking for nginx website services. For more relevant content on anti-hotlinking for nginx website services, please search for previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!

You may also be interested in:

Complete steps for Nginx to configure anti-hotlinking
How to configure Nginx's anti-hotlinking
Nginx anti-hotlink blocks malicious User Agent requests based on UA (anti-spider)
Introduction to the method of anti-hotlinking under Nginx server
Nginx image hotlink protection configuration example
Nginx Anti-Hotlink Configuration Method
3 ways to prevent hotlinks in Nginx

<<: Example of how to set up a multi-column equal height layout with CSS

>>: Vue Page Stack Manager Details