当前位置: 代码网 > it编程>编程语言>其他编程 > 利用nginx同一端口部署多个前端的办法(亲测有效版)

利用nginx同一端口部署多个前端的办法(亲测有效版)

2026年01月26日 其他编程 我要评论
本作用于提供只开放单端口情况下需要开放多个前端的情况前言许多时候由于各种策略或是出于安全等考虑,只开放单个端口,但是此时你需要上线两个项目前端,就需要用到了nginx同一端口部署两前端的方法。一、必备

本作用于提供只开放单端口情况下需要开放多个前端的情况

前言

许多时候由于各种策略或是出于安全等考虑,只开放单个端口,但是此时你需要上线两个项目前端,就需要用到了nginx同一端口部署两前端的方法。

一、必备条件

打包文件:

1.两个前端的路由守卫不互相冲突。

2.两个前端打包的时候不能直接打包,需要在publicpath中加上对应转发路径,如果不加上就会出现,请求的路径匹配不上nginx转发原则的情况。

nginx:

安全稳定版本能跑起来的nginx(笔者吃过亏,遇到过本身就跑不起来的nginx)。

二、配置nginx的conf

这是关键的步骤

将nginx.conf改成:

server {
    listen 80;
    server_name example.com;

    # 配置第一个应用,路径为 /app1/
    location /app1/ {
        alias /var/www/app1/;
        try_files $uri $uri/ /app1/index.html;
    }

    # 配置第二个应用,路径为 /app2/
    location /app2/ {
        alias /var/www/app2/;
        try_files $uri $uri/ /app2/index.html;
    }
}

alias中配置的是两个前端文件路径,转发的标识根据你打包文件中publicpath的路径而定制

注意事项

在 alias 后的路径末尾需要添加斜杠 /,否则可能会导致文件路径错误。

最后

到此这篇关于利用nginx同一端口部署多个前端的文章就介绍到这了,更多相关nginx同一端口部署多个前端内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!

(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2026  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com