什么是动静分离不解释了，网上说的很清楚，这里只说配置
- 目的
02虚拟机运行一个tomcat，处理动态请求，而对静态文件的访问则交给01虚拟机。 - 操作
下面是01虚拟机的配置文件内容：
server {
listen 82;
listen [::]:82;
#root /var/www/web/index;
#index index.html;
server_name localhost;
location / {
proxy_pass http://192.168.xxx.xxx:8080;
#try_files $uri $uri/ =404;
}
location /css {
root html;
index index.html index.htm;
}
location /js {
root html;
index index.html index.htm;
}
location /img {
root html;
index index.html index.htm;
}
}
首先修改proxy_pass，改为02虚拟机的tomcat地址端口，然后设置location，很好理解，访问css就去html目录下的css目录中查找，js和img同理。
- 效果
下面访问02虚拟机的端口，发现静态文件全是从01虚拟机对应的目录下去取的（前提是提前将对应的静态文件放到01虚拟机的相应目录），此时删除02虚拟机对应目录下的文件依然能够在页面上准确返回相应的内容。 - 原理
反正静态文件是不变的，经过nginx从tomcat去取，取完了返回给nginx，再给用户呈现，还不如直接把静态放到nginx，别经手tomcat，因为tomcat是处理动态请求的服务器。因此就做到了动静分离。
- 正则匹配
可以看到上面js、css、img每人一个location，有些冗余，这里可以使用正则的方法
server {
listen 82;
listen [::]:82;
#root /var/www/web/index;
#index index.html;
server_name localhost;
location / {
proxy_pass http://192.168.xxx.xxx:8080;
#try_files $uri $uri/ =404;
}
location ~*/(js|img|css) {
root html;
index index.html index.htm;
}
}
~表示开始正则。
- 我自己的项目：
项目路径是这样的：
views里面存放html，以login.html做示范。
login.html里面的静态文件路径也不复杂，分别来自上面图片里除了views以外的文件夹，也只是js、img、css这几种静态文件，然后在02虚拟机开启tomcat，并将views放到tomcat的web根目录\demo下，01虚拟机去充当nginx服务器，配置文件我是这么写的：
server {
listen 82;
listen [::]:82;
#root /var/www/web/index;
#index index.html;
server_name localhost;
location / {
proxy_pass http://192.168.xxx.xxx:8080/demo/views/login.html;
#try_files $uri $uri/ =404;
}
location ~*/(js|img|css) {
root /var/www/web ;
index index.html index.htm;
}
}
我发现，来自js、css、img这几个文件夹的静态文件确实可以获取到，但是来自layui、assembly等文件夹的静态文件获取不到。。
于是我修改配置文件：
server {
listen 82;
listen [::]:82;
#root /var/www/web/index;
#index index.html;
server_name localhost;
location / {
proxy_pass http://192.168.xxx.xxx:8080/demo/views/login.html;
#try_files $uri $uri/ =404;
}
location ~*/(js|img|css|layui|assembly) {
root /var/www/web ;
index index.html index.htm;
}
}
其实就是匹配规则里添加了这几个文件夹的名字js|img|css|layui|assembly。我之前以为这里的匹配规则匹配的是文件类型，现在才知道，匹配的是路径。。
于是就好了：
