Issue
I have an Angular application and a landing page written in jQuery.
I want to serve the landing page every time the request is on the root of http://mywebsite.com
. Anything else, let's say http://mywebsite.com/otherpage
, I want to serve the Angular application.
With nginx
(production), this is fairly easy.
When developing Angular, we can easily proxy other requests, like /api
, with --proxy-config proxy.config.json
CLI option.
The problem I'm getting is with the root level.
What am I doing wrong? Can't I proxy the root level?
Angular docs tells us to go to Webpack dev-server docs, but still I couldn't figure out how to do it.
My proxy.config.json
is like the following:
{
"/api/*": {
"target": "http://localhost:3000",
"secure": false,
"logLevel": "debug"
},
"/": {
"index": "",
"target": "http://localhost:3000",
"secure": false,
"logLevel": "debug"
}
}
Solution
I got a working proxy config which just intercepts the root and not a angular application served with baseHref. You need to use a .js
config (https://angular.io/guide/build#proxy-multiple-entries) with an exclusion defined for http-proxy-middleware
(https://github.com/chimurai/http-proxy-middleware#context-matching). The config below proxies every request expect when it starts with /otherpage
. The angular application should use '/otherpage' as baseHref
const PROXY_CONFIG = [
{
context: [
"/**",
"!/otherpage**"
],
"target": "http://localhost:3000",
"secure": false,
}
];
module.exports = PROXY_CONFIG;
Answered By - c0l3
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.