如何路由到不同的服务器和名称空间

时间:2020-04-03 09:55:40

标签: nginx url routing url-routing reverse-proxy

如果这在黑暗中有点麻烦,请原谅我,我的DevOps /架构技能是v v最低的,所以我不确定使用正确的术语。

我有一个React应用程序托管在AWS上,我想坐在根mysite.com以及某些“子目录”上,例如mysite.com/itemsmysite.com/category

此外,我想在其他地方托管一个博客,但可以在mysite.com/blog上访问它,并可以使用一些其他静态页面,例如mysite.com/aboutmysite.com/contact。我希望将这些静态页面托管在同一位置(我在考虑webflow)。

这似乎有点复杂,但是我想知道什么是最佳解决方案。 Nginx的反向代理是否可以正常工作,如果可以,您将如何配置它?还有其他可行的“无服务器”解决方案吗?

也许有一种方法可以将所有流量发送到静态页面服务器,除非它是根服务器或特定的/items/category/blog

1 个答案:

答案 0 :(得分:1)

您的基本配置如下所示:

server {
    listen 8080;
    return 200 "Blog \n";
}

server {
    listen 8081;
    return 200 "About and Contact \n";
}

server {
    listen 80;

    location = /about {
        proxy_pass http://localhost:8081;
    }

    location  /blog {
        proxy_pass http://localhost:8080;
    }
}

让我在其中添加一些文字:)

如果您只想知道某个位置/ about,而该位置中没有其他信息,则可以使用= /about

尝试在/about之后添加诸如/about/foo之类的内容会导致404。

如果您要将博客代理到其他位置,请使用/blog。使用此配置,您可以自由地向您的位置添加一些内容,例如/blog/test/,它仍然会以200响应。

[root@localhost conf.d]# curl -v localhost/blog/test
* About to connect() to localhost port 80 (#0)
*   Trying ::1...
* Connection refused
*   Trying 127.0.0.1...
* Connected to localhost (127.0.0.1) port 80 (#0)
> GET /blog/test HTTP/1.1
> User-Agent: curl/7.29.0
> Host: localhost
> Accept: */*
>
< HTTP/1.1 200 OK
< Server: nginx/1.17.6
< Date: Tue, 17 Mar 2020 06:09:31 GMT
< Content-Type: application/octet-stream
< Content-Length: 12
< Connection: keep-alive
<
/blog/test
* Connection #0 to host localhost left intact

开发中的无服务器方式

在您的react应用中使用某种东西将流量路由到正确的目标。

https://create-react-app.dev/docs/proxying-api-requests-in-development#configuring-the-proxy-manually

我为我的一个项目做到了这一点,它的工作很棒!

作为一般参考和想法,我将在不适应您的问题的情况下共享我的文件。

const proxy = require('http-proxy-middleware');

module.exports = function (app) {
    app.use('/api', proxy({
        target: 'http://localhost:8080',
        changeOrigin: true,
    }));

    app.use('/img', proxy({
        target: 'http://localhost:8080',
        changeOrigin: true,
    }));

    app.use('/oauth', proxy({
        target: 'http://localhost:8080',
        changeOrigin: true,
    }));
};

此文件(setupProxy.js)位于根目录下的thr src目录中。

用于生产

我只知道与node.js的快速ontop集成。由于代理已与http-protocoll紧密相关,因此您迫切需要一个了解http协议的服务器组件。

在过去的几个月中,我注意到使用快速Web服务器作为代理有很多缺点。缓存在NGINX级别上更有效。如果增加了路由复杂度,NGINX可以更好地处理它。