大型网站分布式架构（七）—— Nginx整合Tomcat实现动静分离

最新推荐文章于 2021-03-31 23:00:51 发布

我爱你啊朱海洋

最新推荐文章于 2021-03-31 23:00:51 发布

阅读量261

点赞数

分类专栏：运维文章标签： nginx 动静分离

运维专栏收录该内容

12 篇文章 0 订阅

订阅专栏

前提，我们需要：

Web项目 —— 大型网站分布式架构（一）—— SpringBoot构建项目
Tomcat容器 —— 大型网站分布式架构（二）—— Linux下Tomcat的安装和项目部署
Nginx服务 —— 大型网站分布式架构（六）—— Nginx的安装

为什么要做动静分离

动静分离是将网站静态资源（HTML，JavaScript，CSS，img等文件）与后台应用分开部署
动静分离的一种做法是将静态资源部署在nginx上，后台项目部署到应用服务器上，根据一定规则使对静态资源的请求全部交给nginx处理，而讲动态请求转发给应用服务器处理，达到动静分离的目标，从而提高网站的并发性能，达到优化网站架构的效果

è¿éåå¾çæè¿°

下面我们将使用一台Nginx+一台Tomcat模拟实现动静分离，项目将使用博主之前构建的项目并做部分修改

修改Web项目
修改项目下的index.html，添加img标签和js引入，修改后的代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>欢迎进入枣面包的面包坊</title>
    <script type="text/javascript" src="js/nothing.js"></script>
</head>
<body>
    <h1>欢迎进入枣面包的面包坊</h1>
    <img src="img/photo.jpg">
</body>
</html>

项目添加photo.jpg和nothing.js文件

è¿éåå¾çæè¿°
将项目打包部署到之前搭建的Tomcat服务器中并启动，通过浏览器访问：

è¿éåå¾çæè¿°

可以看到访问返回了3样东西：

访问接口通过模板渲染之后得到的文档：document
获得JavaScript标签引入的js文件：script——nothing.js
获得img标签请求得到的静态图片：jpeg——photo.jpg

配置nginx.conf

worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;

        #配置静态资源交给nginx处理，这里先只配置js和jpg
        location ~ .*\.(js|jpg) {
            root /export/data/nginx/appdemo; #静态文件目录
            expires 30d; #缓存天数
        }
        #配置除静态资源以外的交给tomcat处理
        location / {
            proxy_pass http://localhost:8080/appdemo-0.0.1-SNAPSHOT/;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }

}

重启Nginx服务

[root@centos6-1 ~]# cd /usr/local/nginx/sbin/
[root@centos6-1 sbin]# ./nginx -s reload

web访问Nginx服务：192.168.214.150，情况如下：

è¿éåå¾çæè¿°

发现访问nginx时，即变成了访问tomcat服务，这里就是用nginx进行了反向代理；但是也发现了获取不到nothing.js和photo.jpg文件，那是因为nginx配置了静态资源的路径，而该路径下没有该资源导致的，将对应资源上传到指定位置即可，在nginx.conf文件中的配置的静态资源路径为：/export/data/nginx/appdemo

上传静态资源
使用lrzsz工具上传：三种方式实现Linux的文件上传下载，https://blog.csdn.net/weixin_37490221/article/details/80844825

[root@centos6-1 ~]# cd /export/data/nginx/appdemo/
[root@centos6-1 appdemo]# ll
total 8
drwxr-xr-x. 2 root root 4096 Aug 27 03:42 img
drwxr-xr-x. 2 root root 4096 Aug 27 03:42 js
[root@centos6-1 appdemo]# cd img/
[root@centos6-1 img]# rz
rz waiting to receive.
Starting zmodem transfer.  Press Ctrl+C to cancel.
Transferring photo.jpg...
  100%       7 KB       7 KB/sec    00:00:01       0 Errors  
[root@centos6-1 img]# ll
total 8
-rw-r--r--. 1 root root 8105 Aug 27  2018 photo.jpg
[root@centos6-1 img]# cd ..
[root@centos6-1 appdemo]# cd js
[root@centos6-1 js]# rz
rz waiting to receive.
Starting zmodem transfer.  Press Ctrl+C to cancel.
Transferring nothing.js...
Transferring nothing.js...

[root@centos6-1 js]# ll
total 0
-rw-r--r--. 1 root root 0 Aug 27  2018 nothing.js
[root@centos6-1 js]#

浏览器访问

è¿éåå¾çæè¿°

总结
到这里就实现了Nginx和Tomcat的集成，实现了web服务的动静分离，将静态资源交给Nginx处理，这里是将静态资源存储在本地，通过Nginx访问，当然也可以代理到其他静态服务器上；再将非静态资源的请求代理给Tomcat动态处理。这样即削减了Tomcat的压力，又发挥了Nginx高并发的能力，使web服务更加健壮。但是这里只是配置了单台Tomcat，当动态请求过多时，一台Tomcat服务器肯定是不足以处理足够多的动态请求的。后面将搭建Tomcat集群，通过横向拓展实现Tomcat的高并发。

参考：
https://www.cnblogs.com/xiaoblog/p/4241086.html
http://blog.brucefeng.info/post/static-backend-asolate
http://nginx.org/en/docs/
---------------------
作者：枣面包
来源：CSDN
原文：https://blog.csdn.net/weixin_37490221/article/details/82109766
版权声明：本文为博主原创文章，转载请附上博文链接！