how to proxy to my domain with port from request urls that start with api?

Question

I have a loopback 3 set up listening on the port 3000. And my front end app is built with Vue JS. ( I uploaded dist files to the server). Whenever I make an api call (https://example.com/api/xxx), I need to proxy to (https://example.com:3000/api/xxx) in order to avoid cors issues.

How do I resolve this?

FYI, the loopback and vueJS are hosted on the same web server (apache, centos8)

Answer 1

Use NGINX Reverse Proxy https://docs.nginx.com/nginx/admin-guide/web-server/reverse-proxy/

http://localhost:5000 - points to your Vue.js app http: //localhost:3000 - points to your REST API app

server {

  listen 80;

  server_name example.org;

  location / {
    proxy_pass http://localhost:5000;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header Host $host;
  }

  location ^ ~/api {
    proxy_pass http: //localhost:3000;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header Host $host;
  }
}