Cross-Domain Ajax That Works (When You Let It)

Your Ajax JavaScript can request content from another domain. It will get the content only if the other domain allows it.

Conversely, an Ajax call from someone else's domain can get content from your domain. When you let it.

The default is that any Ajax request from another domain is rejected.

As implied, it can be allowed. Should you want to.

I'll show you how.

Here are two reasons for allowing it.

1. To provide exclusive content for select domains.

   You maintain a list of authorized domains. If an Ajax request is from an authorized domain, the domain gets the content. Otherwise, it doesn't.

   Your "authorized" list of domains could be composed of

   • Domains that pay you to be on the list.
   • A group of cooperative websites with related content.
   • The domains of a circle of friends or family members.

   I'll show you how to grant request by Ajax only those on your authorized list.

2. To deliver articles to any domain that wants it.

   If you're promoting content for free or desire to see it on as many websites as possible, then allowing any domain to pull in the content with their Ajax is an option to consider.

   If you choose that option, domains that don't adhere to your terms or otherwise don't comply with your requirements can be banned.

   I'll show you how to let any domain get your content via Ajax. And I'll show you how to bann individual domains.

As stated earlier, if you do nothing, then every Ajax request to your web site from another domain is automatically denied.

Note: To get up to speed with an article about how Ajax works and with the code for an Ajax engine, see Ajax, How It Works and How To Use It and Copy and Paste Ajax Engine.

How Cross-Domain Ajax Works

Every request from Ajax is accompanied by a special header. The header identifies the URL of the web page making the request.

To allow the other-domain Ajax request, the web page or file that is being requested needs to authorize it.

If the web page or file is a static page, it can't respond with the required authorization information. Therefore, it must be a web page generated by server software, such as PHP, that can respond with custom header information before it responds with the content.

So these are the steps:

1. An Ajax request is made.
2. The page being requested either allows the request or ignores it.
3. If allowed, the page responds with special header information and the content.

How to Allow an Ajax Request

There are two special header lines.

1. A special header line provided by Ajax when it requests content from another domain.

2. A special header line sent back to Ajax as the approval if the requested web page chooses to respond.

In a PHP script, the special header that contains the URL of the web page making the Ajax request is stored in the $_SERVER['HTTP_ORIGIN'] variable.

The variable's value can be used to decide whether or not to allow the Ajax request.

If the decision is to allow the Ajax request, the requested content is provided with a special header. The special header label is Access-Control-Allow-Origin and it's value must match exactly the value of the $_SERVER['HTTP_ORIGIN'] variable that Ajax sent.

If the value of Access-Control-Allow-Origin doesn't match the value of $_SERVER['HTTP_ORIGIN'] then Ajax itself will reject the content.

To illustrate, these two PHP lines will authorize the content no matter what domain the Ajax request comes from.

$Origin = isset($_SERVER['HTTP_ORIGIN']) ? $_SERVER['HTTP_ORIGIN'] : false;
if( $Origin ) { header("Access-Control-Allow-Origin: $Origin"); }

Like all header lines, the Access-Control-Allow-Origin header must be sent before the content. The working examples show how to do that.

Working Examples Allowing Cross-Domain Ajax Requests

Two working examples follow.

1. Allow Ajax content requests only from authorized domains.

2. Allow Ajax content requests from all domains except those that are banned.

Allow Only From Authorized Domains

This script will allow content to be sent in response to Ajax requests only when the request is from an authorized domain. Instructions follow the script source code.

<?php
/* Allow content only for authorized Ajax requests. */
/* Will Bontrager Software, LLC */
/* July 1, 2016 */

$AuthorizedDomains = <<<AUTHORIZEDDOMAINS

/* List the domain names that are authorized. */
www.willmaster.com
blogsjustin.com
willbontrager.com
/* End of list. */

AUTHORIZEDDOMAINS;
$Origin = isset($_SERVER['HTTP_ORIGIN']) ? $_SERVER['HTTP_ORIGIN'] : false;
if( ! $Origin ) { exit; }
$AuthorizedList = array();
$AuthorizedDomains = preg_replace('!/\*.*?\*/!is','',$AuthorizedDomains);
$AuthorizedDomains = trim( $AuthorizedDomains );
$AuthorizedDomains = strtolower($AuthorizedDomains);
foreach( preg_split('/\s+/', $AuthorizedDomains ) as $domain )
{
   if( preg_match('/\w\.\w/',$domain) )
   {
      $domain = preg_replace('!^https?://!','',$domain);
      $AuthorizedList[$domain] = true;
   }
}
$OriginDomain = preg_replace('!^https?://!','',strtolower($Origin));
$OriginDomain = preg_replace('!/.*$!','',$OriginDomain);
if( empty( $AuthorizedList[$OriginDomain] ) ) { exit; }
header("Access-Control-Allow-Origin: $Origin");
echo '[this is the content]';
?>

Replace the list of authorized domain names (colored blue in the above code) with the domains that you are authorizing to have your content. List one domain per line.

The domain names are subdomain-sensitive. For the list, domain www.willmaster.com is not the same as domain willmaster.com. Therefore, if a domain uses both www. and non-www. versions for Ajax requests, you'll need to list both versions of the domain name.

Replace the colored red echo '[this is the content]'; with code to publish the content to be received by the Ajax request when it's an authorized domain.

When a domain not on your list tries to get the content with Ajax, the browser will receive an error message. Whether or not the error message is presented on the page containing the Ajax JavaScript code depends on how it's coded. If it's coded as provided at Copy and Paste Ajax Engine, the browser will display an alert box with the error message.

Allow From All but Banned Domains

This script allows all domains to have content via Ajax requests — unless the domain is banned.

When you run into a domain that you really don't want to publish your content, list the domain at the place indicated in the script. Instructions follow the script source code.

<?php
/* Allow all Ajax requests to the content. */
/* Will Bontrager Software, LLC */
/* July 1, 2016 */

$BannedDomains = <<<BANNEDDOMAINS

/* List the domain names that are banned. List as many or as few as needed. */
example.com
domain.com
www.badboy.com
/* End of list. */

BANNEDDOMAINS;
$Origin = isset($_SERVER['HTTP_ORIGIN']) ? $_SERVER['HTTP_ORIGIN'] : false;
if( ! $Origin ) { exit; }
$BannedList = array();
$BannedDomains = preg_replace('!/\*.*?\*/!is','',$BannedDomains);
$BannedDomains = trim( $BannedDomains );
$BannedDomains = strtolower($BannedDomains);
foreach( preg_split('/\s+/', $BannedDomains ) as $domain )
{
   if( preg_match('/\w\.\w/',$domain) )
   {
      $domain = preg_replace('!^https?://!','',$domain);
      $BannedList[$domain] = true;
   }
}
$OriginDomain = preg_replace('!^https?://!','',strtolower($Origin));
$OriginDomain = preg_replace('!/.*$!','',$OriginDomain);
if( isset( $BannedList[$OriginDomain] ) ) { exit; }
header("Access-Control-Allow-Origin: $Origin"); 
echo '[this is the content]';
?>

Replace the list of banned domain names (colored blue in the above code) with any domains that you are banning. List one domain per line. As in the previous script, domain names are subdomain-sensitive.

Replace the colored red echo '[this is the content]'; with the code to publish the content to be received by the Ajax request unless it's a request from a banned domain.

When a banned domain tries to get the content with Ajax, the browser will receive an error message. Whether or not the error message is presented on the page containing the Ajax JavaScript code depends on how it's coded. If it's coded as provided at Copy and Paste Ajax Engine, the browser will display an alert box with the error message.

If you wish to allow content to be sent in response to Ajax requests from other domains, select the script that works according to how you want to implement the functionality — only domains you list or all domains except the ones you list.

For Ajax to get content from your domain, the page at your domain must proactively let it happen. With the scripts in this article, you determine which domains can or cannot have your content.

The scripts work by consulting the special header information Ajax provides for the URL of the web page making the request. That information is used to determine whether or not to respond with the requested content.

(This article first appeared in Possibilities ezine.)

Will Bontrager