Nginx配置实例 -- 动静分离

什么是动静分离

动静分离是指在web服务器架构中,将静态页面与动态页面或者静态内容接口和动态内容接口分开不同系统访问的架构设计方法,进而提升整个服务访问性能和可维护性

将静态html页面,css样式,js文件,以及图片文件这些静态资源放到Nginx服务器中,然后把动态请求显示的文件放到类似于Tomcat这样的容器服务器中;这样方便维护,也可以提高系统性能

Nginx实现动静分离

通过Nginx可以分发请求,实现动态请求转发到Tomcat,静态请求转发到Nginx服务器,来实现动静分离;基于前面的案例,这里我再用docker搞一个Nginx作为静态资源服务器,原先的Nginx用来处理负载均衡和动静分离

1、要实现的效果

在浏览器地址栏输入地址http://www.test.com,使请求按负载均衡策略分配到8080、8081端口中,并且页面使用的静态资源都来自于静态资源服务器,而不是web服务器

2、准备工作

  • 用docker准备一个静态资源服务器
#获取nginx镜像
docker pull nginx

#运行nginx容器(运行这个是为了下一步将nginx的配置目录copy到宿主机)
docker run -id -p 1980:80 nginx

#为后续方便修改nginx的配置文件,将nginx的配置目录copy到宿主机,将其作为新nginx容器启动的共享目录
cd /mySoft
mkdir data
docker cp 2ff20dfa911a:/etc/nginx /mySoft/data/nginx

#重新运行一个nginx容器作为静态资源服务器并挂载配置目录与静态资源目录(上面运行的那个可以删除掉)
docker run -it -p 1010:1010 --name=staticNginx -v /mySoft/data/nginx:/etc/nginx -v /mySoft/data/staticdata:/mySoft/nginx nginx

修改nginx容器的配置文件default.conf,注意不要配置upstream,因为只是用作静态资源服务器,并非是代理服务器,配置如下:

Nginx配置实例 -- 动静分离_第1张图片

Nginx配置实例 -- 动静分离_第2张图片

新建staticdata目录:

Nginx配置实例 -- 动静分离_第3张图片

staticdata目录里的index.html文件如下:

Nginx配置实例 -- 动静分离_第4张图片

然后在浏览器输入http://static.test.com:1010,如果出现下图,那静态资源服务器就搞出来了:

Nginx配置实例 -- 动静分离_第5张图片

  • 准备两台Tomcat服务器,一台端口是8080,一台端口是8081

3、具体配置

现在有web服务器两台Tomcat8080、Tomcat8081,静态资源服务器一台staticNginx,然后就可以更改代理服务器的配置了,重点配置Nginx负载均衡和静态分离,如下:

Nginx配置实例 -- 动静分离_第6张图片

upstream myserver{
	server 192.168.174.18:8080 weight=1;
	server 192.168.174.18:8081 weight=2;
}

 upstream static.test.com{
	 server 192.168.174.188:1010;
}
server {
	listen       80;
	server_name  www.test.com;

	location / {
		root  html;
		proxy_pass	http://myserver;
		index  index.html index.htm;
	}
	
	location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
		proxy_pass http://static.test.com;
	}

	location ~ .*\.(js|css)?$ {
	   proxy_pass http://static.test.com;
	}

	location ~ .*\.(html)?$ {
	   proxy_pass http://static.test.com;
	}
}

修改Tomcat8080、Tomcat8081中的index.jsp,方便看到代理服务器的代理效果,如下:

Nginx配置实例 -- 动静分离_第7张图片

Nginx配置实例 -- 动静分离_第8张图片

然后在浏览器输入http://www.test.com,查看动静分离的效果,如下图:

Nginx配置实例 -- 动静分离_第9张图片

4、访问过程的分析

Nginx配置实例 -- 动静分离_第10张图片

你可能感兴趣的:(中间件,nginx,动静分离)