How to correctly configure a reverse proxy with Apache, to be used for cross-domain AJAX?

Question

Needing to develop a web application that at the same time is highly dependent on an API but at the same time cannot reside on the same domain as the API itself, it\'s been quit

Answer 1

You are having a server with a public IP and apache is running on it.Now you want to host your applications on LAN and also want them to be accessible on internet the important part is these applications are still running on the machines on LAN.

                           |--------------192.168.1.3
                           |            (internal3.example.com)
                           |
                           |--------------192.168.1.4
                           |            (internal4.example.com)
  (Public IP )             |
            A--------------|
(reverse proxy server)     |
  (192.168.1.25)           |
example.com                |
                           |--------------192.168.1.1
                           |            (internal1.example.com)
                           |
                           |--------------192.168.1.2
                           |            (internal2.example.com)

I am using Ubuntu to host Apache the vhost definition in case of Debian based systems the definiton of websites is done on

/etc/apache2/sites-enabled/*.conf

where *conf corresponds to

internal1.conf internal2.conf internal3.conf internal4.conf

The vhost definition of each of these sites will be as follows

/etc/apache2/sites-enabled/internal1.example.conf

    ServerAdmin webmaster@localhost
    ServerName internal1.example.com
    ProxyRequests off
    
        Order deny,allow
        Allow from all
    
    ProxyPass / http://192.168.1.1/
    ProxyPassReverse / http://192.168.1.1/ 

/etc/apache2/sites-enabled/internal2.example.conf

      ServerAdmin webmaster@localhost
      ServerName internal2.example.com
      ProxyRequests off
      
      Order deny,allow
      Allow from all
      
      ProxyPass / http://192.168.1.2/
      ProxyPassReverse / http://192.168.1.2/

/etc/apache2/sites-enabled/internal3.example.conf

      ServerAdmin webmaster@localhost
      ServerName internal3.example.com
      ProxyRequests off
      
      Order deny,allow
      Allow from all
      
      ProxyPass / http://192.168.1.3/
      ProxyPassReverse / http://192.168.1.3/

/etc/apache2/sites-enabled/internal4.example.conf

    ServerAdmin webmaster@localhost
    ServerName internal4.example.com
    ProxyRequests off
    
        Order deny,allow
        Allow from all
    
    ProxyPass / http://192.168.1.4/
    ProxyPassReverse / http://192.168.1.4/

Note in all of the above vhost definitions I have dropped the options of Log files. So if you apply to a production server add them in each of the vhost file. Above is just to give you a clear cut example as how it can be working. I run a very complex Apache setup so above is just a small example to help you.

Now coming to Ajax part of your question

in chrome press Ctrl+Shift+I you will see where exactly the application is broken, it will give you some clue, (issue the request from a machine different from the machine on which you are developing web application) also if you can look at apache logs if the request from http://sample page which has ajx api actually reached your apache server that will give you more hint, if the proxy is forwarding your request correctly, post the HTTP HEADERS by using some tool in firefox like live_http in condition when there was no request and the condition when the request was made by the application that way observing the headers one can help you if the request reached the server behind the reverse proxy,also check the logs of server which is running reverse proxy if the request from web reached it or not and if the request reached what is the URL that was requested.This will give you a clue,

and for development purpose in your .conf files disable the rewrite rules for some time to test ,do it one by one.