什么是动静分离
- 为了提高网站的响应速度,减轻程序服务器(Tomcat,Jboss等)的负载,对于静态资源比如图片,js,css等文件,我们可以在反向代理服务器中进行缓存,这样浏览器在请求一个静态资源时,代理服务器就可以直接处理,而不用将请求转发给后端服务器。用户请求的动态文件比如servlet,jsp则转发给Tomcat,Jboss服务器处理,这就是动静分离。这也是反向代理服务器的一个重要的作用。
最近tomcat服务器在本机运行javaweb程序时候,没有一点问题,但是放到阿里云服务器上面时候,总是加载不了js和css页面,一开始总是以为我本地代码写错,到处查,改了半天依旧没有反应。
然后最近在搞nginx反向代理,通过不断查阅,终于nginx对动静分离有了一点了解,从而解决js的404问题
如果没有安装nginx,可以参考这篇文章
下图时tomcat中webapp里面war包,线上运行8080端口域名地址,界面格式显示不出来。我们打开开发者工具,看到这里没有获取到加载js和css文件,这是大多人应该都有的操作吧。
我们这里就通过nginx来转发到tomcat上面,从而实现动静态的分离。
打开nginx.conf,设置参数
- server_name 这是要转发的地址,设置为你自己域名,或者你的tomcat的ip地址,下面的转发地址都填此地址
- root 表示请求别匹配到后,会在这个文件夹内寻找相应的文件,root对后面静态资源的处理很重要。此处我把静态资源重新放了一个文件夹,放在外部 /product/Root中
- location 表示匹配客户端发送请求的路径,这里“/”代表所有请求的路径都能匹配。
这里的 root 位置 很重要,我把地址改成tomcat下的webapp,运行不成功的,然后我就把js、css的文件拿出来,放在外部了,在/product/Root中
cd /usr/local/nginx/conf/
vim nginx.conf
server {
listen 80;
#server_name localhost;
#此处我设置的是域名地址
server_name www.xxx.xxx:8080;
#charset koi8-r;
#access_log logs/host.access.log main
location ~ \.(js|css|html|jpg|gif|png|swf|mp3)$ {
root /product/Root/;
}
location /{
proxy_pass http://www.xxx.xxx:8080;
}
# location / {
# root html;
# index index.html index.htm;
# }
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
此外root的文件路径在这里,跟上面的对应着来看
注意哈,我这里war包还是放在tomcat的webapp下面的。虽然原理我还是不太明白,还在慢慢找资料加深了解中。
页面可以运行了
看下转发路径下的www.xxx.com/js/page.js的 js 文件可以显示出来。
拓展
同一个Nginx服务器同一端口配置多个tomcat服务代理
upstream product_server{
server www.product.com:8080;
}
upstream order_server{
server www.image.com:8081;
}
#HTTP服务器
server {
#监听80端口,80端口是知名端口号,用于HTTP协议
listen 80;
#定义使用www.xx.com访问
server_name www.nginx.com;
#编码格式
charset utf-8;
#代理配置参数
proxy_connect_timeout 180;
proxy_send_timeout 180;
proxy_read_timeout 180;
proxy_set_header Host $host;
proxy_set_header X-Forwarder-For $remote_addr;
#默认指向product的server
location / {
proxy_pass http://product_server;
}
#使用location对不同请求做相应处理
location /product/{
proxy_pass http://product_server;
}
location /image/ {
proxy_pass http://image_server;
}
}
网址输入
www.nginx.com/product
www.nginx.com/image
即可显示
说实话找bug真是让人蛋疼,但是运行出来的效果时候,我是激动的,我当时真的跳起来了!