"webpack-dev-server --progress --inline" reloading page on devServer timeout

[misuzu]

I guess proxy timeout (just the way backend works) triggers page reload.
Chrome Dev Tools screenshot: http://i.imgur.com/aLoA4xm.png http://i.imgur.com/3WSpBmc.png

Chromium 46.0.2490.71
nodejs v4.2.4
webpack 1.12.11
webpack-dev-server 1.14.1

webpack.config.js:

var autoprefixer = require('autoprefixer')
var path = require('path')
var webpack = require('webpack')


module.exports = {
    entry: {
        app: path.resolve(__dirname, 'app', 'index.js'),
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[name].js'
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
                query: {
                    compact: false,
                    cacheDirectory: true,
                    presets: ['es2015', 'react'],
                },
            },
            {
                test: /\.css$/,
                loader: 'style!css'
            },
            {
                test: /\.scss$/,
                loaders: ['style', 'css', 'postcss', 'sass']
            },
            {
                test: /\.(png|jpg|gif)$/,
                loader: 'url-loader?limit=4096&name=[name].[ext]'
            },
            {
                test: /\.(html|svg|eot|woff|woff2|ttf)$/,
                loader: 'file?name=[name].[ext]'
            }
        ]
    },
    postcss: [
        autoprefixer({
            browsers: ['last 2 versions']
        })
    ],
    devServer: {
        proxy: {
            '/*': {
                target: process.env.SERVER,
                secure: false,
                changeOrigin: true,
            },
        },
    },
    plugins: (process.env.NODE_ENV == 'production') ? [
        new webpack.DefinePlugin({
            'process.env': {
                'NODE_ENV': JSON.stringify(process.env.NODE_ENV)
            },
        }),
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            }
        }),
        new webpack.optimize.DedupePlugin(),
    ] : [],
}

[margru]

I'm experiencing a similar issue with AJAX requests which are proxied to a backend server. It's a big issue as even POST requests are sent again by the webpack dev proxy server and thus creating multiple records on the server side (the creation takes some minutes to finish as some calculation are done there). Is there any possibility to set the proxy timeout or to avoid it completely?

[oers]

This was giving me major headaches. There seems to be hard wired timeout (like 2 minutes) after which the proxy sends the request again.
I too have long running actions.
The second request will always crash due to database locks and report a failure to the client.

I really need a way to disable this proxy timeout or set it to a higher value.

[SpaceK33z]

This was fixed with PR #478, and released with 1.15.0.

[Martin-Luft]

@SpaceK33z please reopen this issue because we got the same behaviour with 2.1.0-beta.11 :( We have a long running job (3-4 minutes) and after 2 minutes the proxy sends a second request to the server.

[SpaceK33z]

Can you provide an easy way of reproducing this? Or are you willing to send a PR?

[Martin-Luft]

Hopefully @phillipj can fix it? An easy way, hmmm, a REST interface which waits 3 minutes before responding and logging all incoming requests... Or a nodejs server which the same functionality... I'm working on it!

[phillipj]

Reading the previous comments here, the issue here is requests being retryed? Not the whole webapp being reloaded, like which was the issue issue in #478.

Worth mentioning that 2 minutes is the default timeout in Node.js core, that's probably the reason several of you have experienced a 2 minute timeout. It's configurable with https://nodejs.org/dist/latest-v6.x/docs/api/http.html#http_request_settimeout_timeout_callback

[Martin-Luft]

@phillipj how to set the timeout for the webpack dev server proxy?

[phillipj]

ATM I don't know -- I don't have a computer available, and reading the source code on mobile isn't really my thing 😕

[Martin-Luft]

@phillipj it would be great if you could find it out next time you have a real computer :)

[phillipj]

As most of the proxy functionality comes from http-proxy-middleware, I'd try providing the proxyTimeout option:

devServer: {
  proxy: {
    '/*': {
        target: process.env.SERVER,
        secure: false,
        changeOrigin: true,
        proxyTimeout: 1000 * 60 * 5, // 5 minutes
    },
  },
},

[Martin-Luft]

@phillipj this does not help :( After 2 minutes the request was repeated :(

Please checkout this little example:

https://github.com/Martin-Wegner/webpack-dev-server-issue-369

and run npm install and npm start.

Finally open your brower and go to http://localhost:8080/test/.

You will see the message incoming request and after 2 minutes as second message incoming request.

[phillipj]

@Martin-Wegner thanks for creating that repro project!

I've done some digging now, and haven't found anything in webpack-dev-server or the http-proxy-middleware explicitly doing some retrying for all HTTP requests being proxied.

Because of that I started suspecting the browser as the culprit, and found a couple of hints suggesting that actually might be the case: http://stackoverflow.com/a/19697278. That's new to me and I've never encountered this before, but I don't have any other suspects ATM.

[Martin-Luft]

@phillipj thanks.

when the connection is closed before receiving a response from the server

But who closes the connection?

In general the connection should not be closed and therefore no retry should be applied. A good example is the use of asynchronous servlets for web push notifications.

[phillipj]

But who closes the connection?

Excellent question which made me do another round of digging, which let me to find the culprint.

http-proxy doesn't set a timeout on the incoming request, which is 2 minutes as default, and therefore closes the incoming request too early even when proxyTimeout is set.

The proxyTimeout option only sets timeout on the outgoing request the proxy makes, which is neccessary to solve this issue, but it's only one of the two timeouts which needs to be set.

Although not documented, incoming requests to a Node.js HTTP server has default timeout of 2 minutes. If one wants to change that, request.setTimeout() has to be invoked.

By invoking req.setTimeout(x) in http-proxy's request listener and doing something similar in your repro server Martin-Luft/webpack-dev-server-issue-369#1, I was able to get the Hello World message printed.

I probably won't be able to open a PR against the http-proxy module in the next few days, so anyone who wants to give it a shot, please go ahead.

[Martin-Luft]

@phillipj a PR would be great :)

[phillipj]

@Martin-Wegner sorry for dropping the ball on this. I've submitted the PR http-party/node-http-proxy#1154, fingers crossed we'll get this fixed at last.

[mohankumarv2005]

Solved, please see #391

Need to set timeout in Server.js