0

I'm working on a personal-use-only Angular application which retrieves data and images from 3rd party servers and displays it in a format useful to myself.

Question: How can I enable a Reverse Proxy in Apache2.4 on my Synology NAS to work with my Angular single page application.

Background: I already have a sort-of single page Angular application hosted locally using Angular routing so that:

  • mydomain.web/app1 - Gives me one application
  • mydomain.web/app2 - Gives me another application.

I'm now adding the 3rd application.

The files are hosted on my Synology NAS with Apache2.4 enabled and I've had to add a .htaccess file with these rules to make the Angular routing work (this was done years ago and I have no memory of where I got this from or how it works):

RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html

To run my 3rd application in development mode, I'm using a json proxy configuration file, similar to:

{
  "/data": {
    "target": "https://someone.elses.server.net",
    "secure": true,
    "pathRewrite": {
      "^/data": "/their-route/data"
    },
    "changeOrigin": true
  },
  "/image": {
    "target": "https://a.different.server.again.net",
    "secure": true,
    "pathRewrite": {
      "^/image": "/their/patg/image"
    },
    "changeOrigin": true
  }
}

This all works fine. However, I now want to make it work in production. I can't edit the /usr/local/etc/apache24/conf/httpd24.conf on my Synology NAS (actually I can, but it gets restored on reboot), but that file includes a "IncludeOptional sites-enabled/*.conf" line at the bottom, so I've added my own .conf file to the sites-enabled folder, which does seem to be used when I restart Apache - as I can easily mess up my whole site if I do something wrong in there.

So, at a simple level to test the /data route, I've tried this in my .conf file:

ProxyPass "/data" "https://someone.elses.server.net/their-route/data"
ProxyPassReverse "/data" "https://someone.elses.server.net/their-route/data"

This does not do anything that I can tell, I get the same 200 response with or without it. Looking at the network traffic, the request to mydomain.web/data gives the same response as the request to the mydomain.web/api3 route - which suggests to me that the .htaccess file is possibly interfering with my attempt at the reverse proxy.

Some sites have suggested that my reverse proxy needs a bit more content to work, so I've also included this:

ProxyRequests Off

<Proxy api>
  Order Deny,Allow
  Allow from all
</Proxy>

But when I do that, nothing works (I get 502 errors) and even my basic mydomain.web/api1 stuff fails.

I would appreciate any help in directing me to getting this to work.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.