webpack-dev-server: smerujte volania HTTPS API cez podnikovú proxy

Pridajte HttpsProxyAgent do existujúceho proxy middlewaru webpack-dev-server a zachovajte cieľ aj prepisovanie cesty.

Nakonfigurujte pripojenie k API na strane Node v webpack.config.mjs pomocou aktuálnej podoby poľa proxy:

import { HttpsProxyAgent } from 'https-proxy-agent';

export default {
  devServer: {
    proxy: [{
      context: ['/api'],
      target: 'https://service.example',
      changeOrigin: true,
      agent: new HttpsProxyAgent('http://proxy.example:8080'),
      pathRewrite: { '^/api': '' },
    }],
  },
};

Trasa je:

browser → webpack dev server → corporate proxy → HTTPS API

target zostáva skutočné HTTPS API. Agent, o ktorom sa predpokladá, že už v projekte je, vyjednáva cestu cez HTTP sprostredkovateľa.

context vyberá cesty požiadaviek, ktoré vidí prehliadač; pathRewrite odstraňuje vývojový prefix. Ani jedno z nich neuvádza podnikovú proxy. Zachovajte tieto mapovania pre cestu, ktorú API očakáva.

Používajte bežné streamovanie a spracovanie odpovedí middlewaru, aby odmietnutie API a zlyhanie prenosu zostali rozlíšiteľné. Druhý ručne napísaný relay, ktorý vždy vracia 200, by tento výsledok skryl.

Nastavenia proxy prehliadača a proxy na sťahovanie balíkov npm konfigurujú iných spotrebiteľov. Toto nastavenie patrí procesu webpack, ktorý vykonáva externé volanie API.

Súvisiace články