Webpack 不接受 POST 个请求

Question

我目前正在开发与 API 通信的 Angular 2 网络应用程序。在应用程序中，用户可以选择支付选项，API 将 return url 发送到支付服务。

问题是支付服务使用 POST 去 WebPack 不接受的确认页面（出于某种原因它只允许 GET 请求），我们得到以下错误：

Cannot POST /selection/payment-method

有人知道我们如何配置 WebPack 也允许 POST 请求吗？我已经联系了支付提供商，但无法执行 GET 请求而不是 POST。

谢谢

Answer 1

Webpack-dev-server 仅用作您的前端服务器，例如。为您的静态资产提供服务。因此只支持 GET 请求。

如果您想使用代理或后端服务器，那么您应该实现它。您可以为此使用 Express。参见 how you can setup basic routing。

Answer 2

一种至少不会收到 404 错误的 hackish 方法是将请求代理到 /selection/payment-method 并发回空响应（或任何你想要的内容，我认为 res 是一个实例Express 的 Response class) 对于那些，通过将以下内容添加到 webpack.config.js:

devServer: {
  proxy: {
    '/selection/payment-method': {
      bypass : (req, res) => res.end()
    }
  }
}

文档 here.

Answer 3

感谢@robertklep 向我发送 link 代理文档，我们找到了处理它的方法。我们需要做的不是处理 POST 请求，而是需要将其以某种方式转换为 GET。在阅读了更多文档后，我们发现了 setup: 属性用于您的 webpack-dev-server 配置。

使用 setup: 属性你可以获得 expressjs 对象，你可以在它到达 Cannot POST /url/to/page.

的路由之前捕获 url

我们最终得到了这个：

devServer: {
    setup: function(app) {
        app.post('/selection/payment-method', function(req, res) {
          res.redirect('/selection/payment-method');
        });
    },
}

这样我们得到一个 GET 请求而不是 POST 并且我们的应用程序执行一个 API 请求来检查支付是否成功。

这只用于开发！

Answer 4

根据@Sven 的回答，修改设置，使其适用于 POST 整个过程

添加对 body-parser、sync-request 的依赖项，并在 webpack.config.js

中添加对两者的依赖项

var bodyParser = require('body-parser');
var request = require('sync-request');

在 webpack.config.js

的 devServer 部分

devServer: {
        setup: function(app) {
            app.use(bodyParser.json());
            app.use(bodyParser.urlencoded({
                extended: true
            }));

            app.post(/^\/(URL1|URL2|URL3)\//, function(req, res) {
                var serviceCallResponse = request('POST', 'your app server url here' + req.originalUrl, {
                    json:req.body
                });
                res.send(serviceCallResponse.getBody('utf8'));
            });
        },
        proxy: {
            '*/other URLs proxy/*': 'your app server url here'
        }
}

将 URL1/2 更改为您要代理的 URL，然后放置您的应用程序服务器地址。

这将适用于各种 POST 请求代理（处理 json 负载）

Webpack 不接受 POST 个请求

Webpack not accepting POST requests

angularjs

webpack

webpack-dev-server

angular