webpack-dev-server: kieruj wywołania HTTPS API przez firmowe proxy

Dodaj HttpsProxyAgent do istniejącego middleware proxy webpack-dev-server, zachowując cel i przepisywanie ścieżki.

Skonfiguruj połączenie API po stronie Node w webpack.config.mjs, używając obecnej formy tablicy 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 jest następująca:

browser → webpack dev server → corporate proxy → HTTPS API

target pozostaje prawdziwym HTTPS API. Agent, który, jak się zakłada, jest już dostępny w projekcie, negocjuje ścieżkę przez pośrednika HTTP.

context wybiera ścieżki żądań widziane przez przeglądarkę; pathRewrite usuwa prefiks deweloperski. Żaden z nich nie nazywa firmowego proxy. Zachowaj te mapowania dla ścieżki oczekiwanej przez API.

Używaj zwykłego strumieniowania i obsługi odpowiedzi middleware, aby odrzucenie przez API i awaria transportu pozostały rozróżnialne. Drugi ręcznie napisany przekaźnik, który zawsze zwraca 200, ukryłby ten wynik.

Ustawienia proxy przeglądarki i proxy pobierania pakietów npm konfigurują innych klientów. To ustawienie należy do procesu webpack wykonującego zewnętrzne wywołanie API.

Powiązane artykuły