All kinds of interaction on web involve either a client side or a server side. The client side (usually a web browser) launches a request for some resource on server and the server side (usually a PHP or ASP) gives a response back. If the client and server side is then same, i.e. on the same domain, then resource sharing is fairly simple. But resource sharing with the client and server side on two different domains is a big challenge. Large enterprises usually have distributed sub domains which need to communicate with each other. CORS (Cross Origin Resource Sharing) is a simple and standard way of doing this challenging task. All you need to do is to add some specific headers to the file on the server side to allow two different domains to communicate.

Steps

1

Pick the domain side: First decide whether you are on the client side or on the server side.

Client side domain will send a request for some resource.

Server side domain will generate a response for the requested resource.

Method1

Client Side Domain

This involves sending a request for some resource

1

Open the HTML file present on the client side in which you are sending resource request. As shown, the client is sending request to server side for getting customer’s record with ID as ‘145’.

2

Mention the IP address of the server side domain and complete path of the file that need to be accessed. As shown, the file demo.php which needs to be accessed is present on the Apache sever (occupying port 80) of the server side domain. The server side domain has an IP address of 192.148.0.108.

3

Launch the request using your Apache server by putting the URL localhost/CORS-UsingJquery/sub2.html on the web browser’s address bar. As the path indicates, the requesting client side file sub2.html is present inside a folder named as CORS-UsingJquery. If the access headers are properly set on the server side, then the record of the customer with ID as ‘145’ will be successfully displayed.

Method2

Server Side Domain

This involves generating a response to a resource request.

1

Open the PHP file present on the server side in which you intend to send the response back to the client side.

Set and customize appropriate headers to allow client’s access to file demo2php. The statement header (“Access-Control-Allow-Origin: *”); allows access to every domain as indicated by asterisk (*). You can also specify the IP address of some specific domain to grant access only to that domain.

2

If the headers are specified correctly, then resource access is granted successfully to client side domain.