How to Fix Error Occurred while Trying to Proxy Request

If you’re a developer, you might have encountered an Error occurred while trying to proxy request message on your PC.

This error can cause a lot of problems for some users, but today we want to show you a couple of solutions that might help you fix this issue once and for all.

How can I fix error occurred while trying to proxy request?

1. Check which IP version is the server using

1. Check the IP version of your server.
2. Make sure that the server and proxy are using the same version of IP.

Users reported this error message because the server was using IPV6 while the proxy used IPV4, but after changing that, the issue was completely resolved.

2. Modify your code

1. Open your project.
2. Now modify the code like this:

{

"/api": {

"target": "https://localhost:12345",

"secure": false,

"changeOrigin": true

}

}

Users reported that adding the changeOrigin setting fixed the problem, so be sure to try that.

Read more about this topic

• Error Eas Didnt Fit 275 (0x113): How to Fix it
• Error EA Table Full 277 (0x115): How to Fix it

3. Change web pack proxy configuration

1. Open webpack.config.js. You should find this file in the root of your project directory.
2. Make sure that your code looks like this:

devServer: {

  proxy: {

    "*": "http://[::1]:8081"

    // "secure": false,

    // "changeOrigin": true

  }

},

According to users, it’s crucial that you add [::1] in order to fix this problem, so be sure to try that.

4. Modify the hosts file

1. Open the hosts file. Keep in mind that this file is protected, so be sure to check our guide on how to properly edit hosts file on Windows 10.
2. Now add the following line to the hosts file:
   127.0.0.1 localhost
   
   
3. Save changes and check if the problem is resolved.

5. Remove body-parser

Many users reported that they fixed this issue simply by removing express body-parser middleware before HPM.

After doing that, the issue was completely resolved, so be sure to try that.

6. Add a header in the client proxy

1. Open your code.
2. Modify it like this:

module.exports = function(app) {

    app.use(proxy('/api', {

        target: 'http://127.0.0.1:8080/',

        headers: {

            "Connection": "keep-alive"

        },

    }));

};

Error occurred while trying to proxy request message can cause a lot of trouble, and we covered a similar error in our GraphQL unauthorized error guide, so visit it for more information.

If you’re having additional problems with Webpack, we also have a guide on Field browser doesn’t contain a valid alias configuration error, so don’t miss it.

Also if you’re having problems with proxy, our ERR_PROXY_CONNECTION_FAILED guide should be able to help you fix it.