skip to Main Content

I’m on the projects that were made with Angular Universal.

I need to change blog.mywebsite.com to mywebsite.com/blog for SEO, I used proxy-config in ng start, like code below, it works correctly but it doesn’t work when I run build:ssr

there is no error in the built project, just after running with node dist / server.js show website but I call mywebsite.com / mag I redirect to 404 page, while there is no problem in npm start

  "scripts": {
   "ng": "ng",
   "build": "ng build --prod",
   "start": "ng serve -o  --proxy-config src/proxy.conf.json ",
   "extract": "ng xi18n --output-path=locale",
   "build:ssr": "npm run build:client-and-server-bundles  && npm run 
    webpack:server ",
   "serve:ssr": "node dist/server.js",
   "build:client-and-server-bundles": "ng build --prod && ng run 
     angular.io-example:server",
  "webpack:server": "webpack --config webpack.server.config.js --devServer -- 
   progress --colors"
  }, 

and this is my config-proxy-file:

  {
    "/mag": {
      "target": {
      "host": "mag.mywebsite.com",
      "protocol": "http:",
      "port": 80
     },
     "secure": false,
     "changeOrigin": true,
     "logLevel": "info",
     "pathRewrite": {"^/mag" : ""}
  }
}

2

Answers


  1. You can configure a proxy in the express server of the app. Serving Angular Universal will not use the proxy config that ng serve uses, so it will try to call the relative domain (i.e. localhost and port when running locally). The answer given here explains how to add an express proxy. To summarize:

    In your src/server.ts file, add

    import * as proxy from 'http-proxy-middleware'
    
    const apiProxy = proxy('/api', { target: 'http://localhost:8080' });
    app.use('/api', apiProxy);
    

    Obviously, you will not want to do this when building for production.

    Login or Signup to reply.
  2. The accepted answer is deprecated, since angular 12 we can use –proxy-config flag just as usual 😀

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search