Cross Domain Solution with Ajax

                      

Let us discuss about the 'Root cause' of the problem:

Same origin policy:
The same-origin policy prevents a script loaded from one domain from getting or manipulating properties of a document from another domain. That is, the domain of the requested URL must be the same as the domain of the current Web page. This basically means that the browser isolates content from different origins to guard them against manipulation

Wep applications extensively depend on HTTP cookies to maintain authenticated user sessions, as servers act based on the HTTP cookie information to reveal sensitive information or take state-changing actions. A strict separation between content provided by unrelated sites must be maintained on client side to prevent the loss of data confidentiality or integrity.

Hence the 'Problem' is :

Ajax does not allow cross-domain communication because of restrictions imposed by the browser. If you try to request data from a different domain, you will get a security error/405 error.

Use Case:
Single Page Application, Restful Application

And here are the Solution:
This problem can be bypass in several ways,

Solution I : Create a proxy files at the server side located in same domain.
We can create a proxy files which will bypass the cross domain request. The proxy page will receive a request, and then make a server side requested and response the output. Below I give a PHP solution of the proxy files,
File name: geoproxy.php
   <?php
    $url=$_GET["url"];
    $res = file_get_contents($url);
    echo $res;
    ?>
This page receives the request and echoes the response. So, now we do not make ajax call the different port service directly, instead call the proxy page by “geoproxy.php?url=http://somedomain:port/ geoserver/wms?service=WMS&request=GetFeatureInfo”.

In a similar way for java based application we can use Servlet or JSP tp redirect to some other page with the request data.

This solution has some security risk, because external user can use your bandwith for bypass their route. So, restrict the requester server by checking page referrer. To do that there needs small modification of existing code.

Solution II: Use Reverse proxies web server
Requests can be bypass using apache mod_proxy.so module. It needs some configuration change in httpd.conf file. Uncomment below module in apache httpd.conf file,
LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_http_module modules/mod_proxy_http.so
Now add proxy bypass code below of the file,
ProxyPass /geotest http://localhost:8080/page.html
ProxyPassReverse /geotest http://localhost:8080/ page.html
Restart the apache. Now /geotest requeste are redirected.

Note that in Apache RewriteEngine is On by default so no need to specify  rewrite rule there.

Solution III: Use JSONP (Only 'Get' operation is supported.)
One such mechanism which can request content cross-domain is the <script> tag. JSONP can be used as a way to leverage this property of <script> tags to be able to request data in the JSON format across domains. JSON-P works by making a <script> element (either in HTML markup or inserted into the DOM via JavaScript), which requests to a remote data service location
Sample url:
http://otherdomain.com:/getUserData/111?callback=?'
And the ajax call looks like
'url: url,
success: success,
 type: "GET",
dataType: "jsonp",
//contentType: "application/json;
 charset=utf-8",           
Note that type is ‘get’ and data type is ‘jsonp’

The best solution I think is, using Reverse proxies (Solution II ) where NginX is the best choice for us.