Nginx部署多站点(多端口号)

本文详细介绍如何使用Nginx配置多个前端项目,包括设置监听端口、代理API请求及处理路由重写,确保前端资源正确加载并实现SPA应用的全路径访问。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、 新建前端文件夹;

 

 2、 将前端打包好的文件分别放在项目文件夹中;

 

3、 使用notepad++打开nginx配置文件;

 

4、 添加server部分;

 

#项目1
    server {
	
        listen       8886;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

		location / {
            root   html/nxjcyj-html/;
            index  index.html index.htm;
			try_files $uri $uri/ @router; #截取404的uri,传给@router
        }
		
		location @router {
			rewrite ^.*$ /index.html last; #接到截取的uri,并按一定规则重写uri和vue路由跳转
		}
			
		location /api {
			proxy_pass http://localhost:8000;
		}

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

	#项目2
	server {
	
        listen       8885;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

		location / {
            root   html/szjcyj-html/;
            index  index.html index.htm;
			try_files $uri $uri/ @router; #截取404的uri,传给@router
        }
		
		location @router {
			rewrite ^.*$ /index.html last; #接到截取的uri,并按一定规则重写uri和vue路由跳转
		}
			
		location /api {
			proxy_pass http://localhost:8000;
		}

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值