使用webpack开发服务器，如何代理除“/app”之外的所有内容，但包括“/app/api”

Question

使用 webpack 开发服务器，我希望有一个代理将所有内容代理到服务器，除了我的应用程序。除了在我的应用程序下有一个端点的 api 应该被代理之外：

• /myapp/api/**

  应该被代理

• /myapp/**

  不应被代理（任何

• /**

  应该被代理

以下设置使用旁路功能来执行此操作，但是可以使用单个上下文规范以声明方式完成吗？

proxy: [
    {
        context: '/',
        bypass: function(req, res, options) {
            if (
                req.url.startsWith('/app') &&
                !req.url.startsWith('/app/api')
            ) {
                // console.log ("no proxy for local stuff");
                return false;
            }
            // console.log ("Proxy!")
        },
        // ...
    },
],

Answer 1

根据 https://webpack.js.org/configuration/dev-server/#devserver-proxy webpack 开发服务器使用 http-proxy-middleware 及其文档（https://github.com/chimurai/ http-proxy-middleware#context-matching）您可以使用排除。

这应该适用于您的情况：

proxy: [
    {
        context: ['**', '/myapp/api/**', '!/myapp/**'],
        // ...
    },
],

Answer 2

关于之前的答案，

context

选项在最新版本的http-proxy-middleware中不可用，但可能有一个解决方法