proxyConfig with Windows authentication stopped working after update to 8

🐞 Bug report

Command (mark with an x)

- [ ] new
- [ ] build
- [X] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Is this a regression?

Yes, the previous version in which this bug was not present was: 7.1.4

Description

When using ng serve with a proxy config to forward all api calls to a .net api hosted on local IIS with windows authentication the browser constantly displays the login dialog.

🔬 Minimal Reproduction

Create project in ng7 and forward all api calls to IIS with windows authentication using config below, works fine. Update to 8 and authentication fails.

module.exports = {
    '/api/*': {
        target: "http://localhost/api/",
        secure: false,
        logLevel: "debug",
        changeOrigin: true,
        agent: new Agent({
            maxSockets: 100,
            keepAlive: true,
            maxFreeSockets: 10,
            freeSocketTimeout: 30000,
            timeout: 60000,
            keepAliveMsecs: 300000,
            
        }),
        onProxyRes: proxyRes => {
            let key = 'www-authenticate';
            proxyRes.headers[key] = proxyRes.headers[key] && proxyRes.headers[key].split(',');
        }
    }
};

🔥 Exception or Error

🌍 Your Environment

Failing environment:

Angular CLI: 8.0.0
Node: 12.3.1
OS: win32 x64
Angular: 8.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.800.0
@angular-devkit/build-angular     0.800.0
@angular-devkit/build-optimizer   0.800.0
@angular-devkit/build-webpack     0.800.0
@angular-devkit/core              8.0.0
@angular-devkit/schematics        8.0.0
@angular/cdk                      7.2.0
@ngtools/webpack                  8.0.0
@schematics/angular               8.0.0
@schematics/update                0.800.0
rxjs                              6.5.2
typescript                        3.4.5
webpack                           4.30.0

Working environment:

Angular CLI: 7.1.4
Node: 12.3.1
OS: win32 x64
Angular: 7.1.4
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.11.4
@angular-devkit/build-angular     0.11.4
@angular-devkit/build-optimizer   0.11.4
@angular-devkit/build-webpack     0.11.4
@angular-devkit/core              7.1.4
@angular-devkit/schematics        7.1.4
@ngtools/webpack                  7.1.4
@schematics/angular               7.1.4
@schematics/update                0.11.4
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.23.1

Anything else relevant?

Updated weback-dev-server to 3.3.1 and agentkeepalaive to 4.0.2 to match ng 8.0 in 7.1.4, everything still works in 7.1.4

[raphaeel-m]

Same issue here. IE works fine while Chrome doesn’t work.

[VAchris]

😃 I have found a temporary work around until the Angular team comes up with a patch.

From your Angular project directory, edit the file: node_modules\@angular-devkit\build-webpack\src\webpack-dev-server\index.js

Comment out the following as shown below:

function runWebpackDevServer(config, context, options = {}) {
    const createWebpack = options.webpackFactory || (config => rxjs_1.of(webpack(config)));
    const log = options.logging
        || ((stats, config) => context.logger.info(stats.toString(config.stats)));
    /*config = webpackMerge(config, {
        plugins: [
            new architect_2.ArchitectPlugin(context),
        ],
    });//*/
    const devServerConfig = options.devServerConfig || config.devServer || {};
    if (devServerConfig.stats) {
        config.stats = devServerConfig.stats;
    }

In summary - just before running the webpack dev-server Angular injects a dev-server plugin called ArchitectPlugin. Why this plugin causes new proxy sockets to be opened rather than reused - I haven’t a clue.

@alan-agius4 - can you assign this to a dev who knows the ArchitectPlugin?