How can I get an Apache2.4 reverse proxy working on my Synology NAS for an Angular Single Page...

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.

Continue reading...