Question

我有一个Django应用，该应用在单独的子域上提供多个网站。在开发中，我访问以下站点：

www.myapp.local：8000
data.myapp.local：8000
publish.myapp.local：8000
admin.myapp.local：8000

请注意，这可以使用django_hosts库并通过修改 / etc / hosts 文件来实现，例如：
127.0.0.1 www.myapp.local
127.0.0.1 data.myapp.local
127.0.0.1 publish.myapp.local
127.0.0.1 admin.myapp.local

但是，我无法弄清楚如何在基于Gulp的工作流中配置BrowserSync，以代理所有子域，从而在浏览站点时提供无缝的体验，并在开发时重新加载浏览器。< / p>

配置BrowserSync代理主站点，例如

browserSync.init(
    [paths.css + "/*.css", paths.js + "*.js", paths.templates + '/**/*.html'], {
    proxy: 'www.myapp.local:8000' 
})

仅“捕获”主站点，如果您单击指向子域之一的链接，则会导航到BrowserSync会话之外，并且将由Django直接在端口8000上提供服务。

Answer 1

使用middleware（使用http-proxy-middleware）和rewriteRules的组合，可以使其完美工作：

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

browserSync.init([paths.css + "/*.css", paths.js + "*.js", paths.templates + '/**/*.html'], {
    middleware: [
        function (req, res, next) {
            let target = 'http://' + req.headers.host.replace('myapp.local:3000', 'myapp.local:8000');
            proxy({
                target,
                changeOrigin: true
            })(req, res, next);
        }
    ],
    rewriteRules: [
        {
            match: /myapp.local:8000/g,
            fn: function (req, res, match) {
                return 'myapp.local:3000';
            }
        }
    ]
});

中间件将任何与父域myapp.local:3000匹配的url匹配，并代理对Django侦听的8000端口的请求，而无需更改子域。 rewriteRules用于重写响应中的任何链接，因此可以通过代理正确地反向进行后续导航。

BrowserSync：代理子域

1 个答案: