kylin-nginx的动静分离

Nginx配置动态分离

目录

一、配置测试服务环境

第一步：安装java运行环境
[root@web01 ~]#  yum -y install java

第二步：安装tomcat web服务
https://tomcat.apache.org/  # tomcat的官网
#下载包，解压至/usr/local/
[root@web01 ~]# wget https://dlcdn.apache.org/tomcat/tomcat-10/v10.1.34/bin/apache-tomcat-10.1.34.tar.gz
[root@web01 ~]# tar xf apache-tomcat-10.1.34.tar.gz -C /usr/local/

第三步：启动tomcat服务
[root@web01 ~]# /usr/local/apache-tomcat-10.1.34/bin/startup.sh

第四步：访问测试
10.0.0.7:8080

第五步：配置反向代理，将10.0.0.7:8080代理到www.tom.com
[root@web01 ~]# vim /etc/nginx/conf.d/tom.conf
server {
        listen 80;
        server_name www.tom.com;
        location / {
        proxy_pass http://10.0.0.7:8080;
        }
}  

第六步：检查语法，启动服务
[root@web01 ~]# nginx -t 
[root@web01 ~]# systemctl restart nginx

第七步：Windows配置本地hosts解析
10.0.0.7	www.tom.com

第八步：测试代理
http://www.tom.com/

二、单台实现动静分离

第一步：配置tom.conf文件，检查语法
[root@web01 ~]# vim /etc/nginx/conf.d/tom.conf
server {
        listen 80;
        server_name www.tom.com;
        location / {
        proxy_pass http://10.0.0.7:8080;
        }

        location ~ \.(svg|jpg|jepg)$ {
        root /images;
}
}
[root@web01 ~]# nginx -t

第二步：创建代码目录，赋权，将tomcat的图片拷贝到/images目录
[root@web01 ~]# mkdir /images
[root@web01 ~]# chown dezyan.dezyan /images/
[root@web01 ~]# cp /usr/local/apache-tomcat-10.1.34/webapps/ROOT/tomcat.svg /images/

第三步：浏览器访问测试
http://www.tom.com/tomcat.svg

三、web配置动态分离，负载均衡将其集成在一个html

1.配置静态页(web02)

第一步：配置Nginx的静态页面，直接放置张图片即可
[root@web02 ~]# vim /etc/nginx/conf.d/s.conf
server {
        listen 80;
        server_name www.s.com;

        location / {
        root /code/s;
        index index.html;
        }
}  
[root@web02 ~]# nginx -t 
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
[root@web02 ~]# systemctl restart nginx

第二步：创建代码目录，上传图片，访问测试
[root@web02 ~]# mkdir /code/s
[root@web02 ~]# echo web02... > /code/s/index.html
[root@web02 s]# ls
4K.jpg  index.html

浏览器www.s.com/4K.jpg

2.配置动态页(web01)

第一步：部署tomcat服务
（一）中已部署

第二步:修改tomcat默认的首页
[root@web01 ~]# vim /usr/local/apache-tomcat-10.1.34/webapps/ROOT/index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<HTML>
<HEAD>
<TITLE>dezyan JSP Page</TITLE>
</HEAD>
<BODY>
<%
Random rand = new Random();
out.println("<h1>随机数:<h1>");
out.println(rand.nextInt(99)+100);
%>
</BODY>
</HTML>

第三步：启动tomcat服务
 /usr/local/apache-tomcat-10.1.34/bin/startup.sh
 
第四步：访问测试
10.0.0.7:8080

3.配置负载均衡

第一步：配置动静分离配置文件
[root@lb01 conf.d]# vim /etc/nginx/conf.d/ds.conf
upstream static {
        server 172.16.1.8:80;
}
upstream java {
        server 172.16.1.7:8080;
}
server {
	listen 80;
	   server_name www.s.com;
       location ~* \.(jpg|png|gif)$ {
       proxy_pass http://static;
       proxy_set_header Host $http_host;
}
       location ~ \.jsp {
       proxy_pass http://java;
       proxy_set_header Host $http_host;
       }
}
[root@lb01 conf.d]# nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
[root@lb01 conf.d]# systemctl restart nginx

第二步：通过代理直接访问静态资源
Windows的hosts解析
www.s.com/4K.jpg
F12查看来源为10.0.0.5即正确

第三步：通过代理直接访问动态资源
www.s.com/index.jsp

4.整合动态数据和静态数据集至一个HMTL中

第一步：继续配置动静分离配置文件
[root@lb01 conf.d]# vim /etc/nginx/conf.d/ds.conf
server块中添加
        root /code;
        index index.html;
[root@lb01 conf.d]# nginx -t 
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
[root@lb01 conf.d]# systemctl restart nginx 
[root@lb01 /]# mkdir /code

第二步：整合资源
[root@lb01 /]# vim /code/index.html
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<title>测试ajax和跨域访问</title>
		<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
	</head>
	<script type="text/javascript">
		$(document).ready(function(){
			$.ajax({
				type: "GET",
				url: "http://www.s.com/index.jsp",
				success: function(data){
					$("#get_data").html(data)
				},
				error: function() {
					alert("哎呦喂,失败了,回去检查你服务去~");
				}
			});
		});
	</script>
	<body>
		<h1>测试动静分离</h1>
		<img src="http://www.s.com/4K.jpg">
		<div id="get_data"></div>
	</body>
</html>

第三步：访问测试
www.s.com

5.分别测试：关闭动态资源和关闭静态资源的情况

web01：关闭动态资源
[root@web01 ~]# /usr/local/apache-tomcat-10.1.34/bin/shutdown.sh
#访问测试

#开启web01tomcat
web02：关闭静态资源
[root@web01 ~]# systemctl stop nginx
#访问测试
posted @ 2025-03-21 08:50  丁志岩  阅读(21)  评论(0)    收藏  举报