[webpack]深入理解proxy代理

it2022-06-10  165

1、一个基本的代理

module.exports = { //... devServer: { proxy: { '/api': 'http://localhost:3000' } } };

/api/users将请求代理到的请求http://localhost:3000/api/users。

 

2、重写路径代理

如果不想/api传递,需要重写路径:

module.exports = { //... devServer: { proxy: { '/api': { target: 'http://localhost:3000', pathRewrite: {'^/api' : ''} } } } };

/api/users将请求代理到的请求http://localhost:3000/users。

 

3、支持https

默认情况下,是不接受在HTTPS上运行且具有无效证书的后端服务器。如果需要,可以像这样修改配置:

module.exports = { //... devServer: { proxy: { '/api': { target: 'https://other-server.example.com', secure: false } } } };

 

4、将请求代理到同一目标

如果要将多个特定路径代理到同一目标,则可以使用具有context属性的一个或多个对象的数组:

module.exports = { //... devServer: { proxy: [{ context: ['/auth', '/api'], target: 'http://localhost:3000', }] } };

  

 

参考:https://webpack.js.org/configuration/dev-server/#devserverproxy

转载于:https://www.cnblogs.com/piaobodewu/p/11228973.html


最新回复(0)