Webpack Dev Server proxy doesn't redirect to api backend

Question

I try to redirect my "http://localhost:3000/api/" paths to a "http://example.com/api/" who runs in an apache server.

There's my devServer config:

devServer: {
    publicPath: '/build/',
    port: 3000,
    proxy: {
        '/api': {
            target: 'http://gestios.loc/api'
        }
    },
    historyApiFallback: true
}

When i try to access to http://localhost:3000/api/calltek/apps?permalink=empresas in recieve a 404 error.

Request URL:http://localhost:3000/api/calltek/apps?permalink=empresas
Request Method:GET
Status Code:404 Not Found
Remote Address:127.0.0.1:3000
Referrer Policy:no-referrer-when-downgrade

HTTP/1.1 404 Not Found
X-Powered-By: Express
date: Fri, 05 May 2017 18:13:42 GMT
server: Apache/2.4.23 (Win32) OpenSSL/1.0.2h PHP/5.6.28
vary: accept-language,accept-charset
accept-ranges: bytes
connection: close
transfer-encoding: chunked
content-type: text/html
content-language: es

Solved it follow this topic: http://stackoverflow.com/questions/36662065/webpack-dev-server-proxy-dosent-work — 50l3r, May 05 '17 at 22:21

score 9 · Answer 1 · edited Jul 08 '18 at 17:07

9

Try to add

devServer: {
    publicPath: '/build/',
    port: 3000,
    proxy: {
        '/api': {
            target: 'http://gestios.loc/api'
            secure: false,
            changeOrigin: true
        }
    },
    historyApiFallback: true
}

I wish it helps

edited Jul 08 '18 at 17:07

Vladyslav Zavalykhatko

15,202
8
65
100

answered May 20 '17 at 09:47

zyctinker

91
3

1

**changeOrigin** property made the difference for me. I'm using Webpack 4 and OSX10. Thanks! – Italo Borges Dec 03 '18 at 13:58

score 0 · Answer 2 · answered Jan 31 '22 at 15:56

I have my Express Server running on http://localhost:3000 and I am trying to use the proxy feature of Webpack-DevServer to access my backend Server APIs with /api path on Devserver(http://localhost:8080).

I was having the same issue as yours and I had 2 solutions (Commented in proxy Key)

devServer: {
        port: 8080,
        proxy: {
            // '/api': 'http://[::1]:3000'
            // '/api/**': 'http://localhost:3000/'
        },
        historyApiFallback: true
    }

Webpack Dev Server proxy doesn't redirect to api backend

2 Answers2