nginx配置同一域名下，共存2个nodejs项目

Posted 2021-12-21 howtobuildjenkins

项目背景：

1、官网需要改版，使用nodejs nuxt框架进行重构

2、官网改版没有全部完成、但需要上线首页

 

项目需求：

1、让首页内容显示为新项目

2、让老官网的内容可以被访问到（比如www.n.com/cart,但新项目没有cart接口）

3、首页域名必须是www.n.com

 

这样的话就会引出一些问题，比如我nginx配置的后端，目前是7100端口，但是新项目端口为3000，如果我直接替换location / port：3000，这样替换势必会使旧官网项目404

旧官网nginx配置如下：

server 
    listen  80;
    listen  443 ssl;
    server_name www.n.com 
    include      ssl/niu.com;
    include      error/40x;
    include      error/50x;
    location / 
        proxy_pass http://127.0.0.1:7100;
        add_header ‘Access-Control-Allow-Origin‘ ‘*‘;
        add_header ‘Access-Control-Allow-Credentials‘ ‘true‘;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    

　　

解决过程：

从nginx下手，一开始尝试的一种为多写一层location，locatin = /   prot=3000    location / port=7100

这样解决是比较方便的解决方案，先匹配3000端口，3000端口匹配不到就去7100端口，配置文件如下：

server 
    listen  80;
    listen  443 ssl;
    server_name www.n.com 
    include      ssl/niu.com;
    include      error/40x;
    include      error/50x;
    location = / 
        proxy_pass http://127.0.0.1:3000;
        add_header ‘Access-Control-Allow-Origin‘ ‘*‘;
        add_header ‘Access-Control-Allow-Credentials‘ ‘true‘;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    
    location / 
        proxy_pass http://127.0.0.1:7100;
        add_header ‘Access-Control-Allow-Origin‘ ‘*‘;
        add_header ‘Access-Control-Allow-Credentials‘ ‘true‘;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    
　　

　但是！虽然这种解决方方案可以配置成功，但是由于我前端使用的是nuxt框架，这个框架有个比较坑的axios插件。

这个插件需要写死域名：我写的是www.n.com ，他会去dns上搜一下有没有www.n.com ，如果搜到了，和自己的node进程也匹配上了，才会访问成功，否则，会报错404.

 

所以基于这种location优先级的配置，如果我写了location = / port=3000 这种模式下，后端的node会直接挂掉，也就是说会报404，页面无法访问。

因此上述的办法就没办法在nuxt框架上实现。。。

 

这时候就需要第二种解决方案：

当nginx匹配到404的时候，自动去旧官网上查询，如果查询到了，就返回结果。

配置如下

    location / 
        proxy_pass http://127.0.0.1:3000;
        add_header ‘Access-Control-Allow-Origin‘ ‘*‘;
        add_header ‘Access-Control-Allow-Credentials‘ ‘true‘;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        #新网站报错，跳转到老网站 2019.06.02
        error_page 404 = @old_niu;
    
    #新网站报错，跳转到老网站 2019.06.02
    location @old_niu
        proxy_redirect off;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass http://127.0.0.1:7100;
        #这里配置 老系统的错误页面

     

　　这样就可以先去新官网上匹配，然后如果报错404，就去旧官网，也算一种解决方案。