是否可以在 webpack 开发服务器中代理 websocket 连接？我知道如何将常规 HTTP 请求代理到另一个后端，但它不适用于 websockets，大概是因为代理配置中的目标以 http://...
【问题讨论】：
devServer.public 还不够吗（似乎它将所有您的 WDS 请求发送到该公共域/主机）？
标签： proxy websocket webpack webpack-dev-server
1.15.0 版的 webpack-dev-server 支持代理 websocket 连接。将以下内容添加到您的配置中：
devServer: {
proxy: {
'/api': {
target: 'ws://[address]:[port]',
ws: true
},
},
}
【讨论】：
Webpack 开发服务器不支持代理 ws 连接yet。
在此之前，您可以通过向 webpack 服务器添加额外的 http-proxy 来手动实现代理：
给package.json添加新的依赖：
"http-proxy": "^1.11.2"
通过监听 upgrade 事件手动代理 websocket 连接
// existing webpack-dev-server setup
// ...
var server = new WebpackDevServer(...);
proxy = require('http-proxy').createProxyServer();
server.listeningApp.on('upgrade', function(req, socket) {
if (req.url.match('/socket_url_to_match')) {
console.log('proxying ws', req.url);
proxy.ws(req, socket, {'target': 'ws://localhost:4000/'});
}
});
//start listening
server.listen(...)
注意（使用一段时间后）
代理 websockets 存在问题，因为 WebpackDevServer 使用 socket.io 来通知浏览器代码更改。 socket.io 可能与代理 websocket 冲突；在我的情况下，除非它非常快速响应，否则在从我的服务器返回握手之前断开连接。
那时，我只是放弃了 WebpackDevServer 并使用基于 react-hot-boilerplate 的自定义实现
【讨论】：
@Mr.香料的答案是正确的。但是可以进一步简化，检查http-proxy-middleware，可以设置如下，即添加ws: true，其他设置照常。
// proxy middleware options
var options = {
target: 'http://www.example.org', // target host
changeOrigin: true, // needed for virtual hosted sites
ws: true, // proxy websockets
...
【讨论】：