Make a Cross Domain AJAX Request by JS & PHP – Tutorial

This tutorial is all about Cross Domain AJAX Request. We will learn how to do a Cross Domain AJAX Request with both GET and POST method by using simple JavaScript and PHP with cURL, file_get_contents and fopen.

Cross Domain AJAX Request by JS & PHP

Skills that you need for this tutorial are HTML, CSS, JavaScript, AJAX and PHP. At first, I’ll show you the regular method to make a cross domain AJAX call with get and post method. After that I’ll show you my own way to doing the same differently. I don’t know anybody already has done it in the second alternative way or not but yes, I did it myself for my own and I am sharing it with you. I’m using PHP to GET/POST data instead of JavaScript. Please keep on reading to see how it is done.


Files we need [File structure]

  1. Regular method (with CORS)
    1. GET method
      1. Files on Domain-A
        • index.html
        • script.js
      2. Files on Domain-B
        • ajax.php
    2. POST method
      1. Files on Domain-A
        • index.html
        • script.js
      2. Files on Domain-B
        • ajax.php
  2. Special method (without CORS enabled – uing PHP)
    1. GET method
      1. Files on Domain-A
        • index.html
        • script.js
        • ajax.php
      2. Files on Domain-B
        • ajax.php
    2. POST method
      1. Files on Domain-A
        • index.html
        • script.js
        • ajax-curl.php
        • ajax-gfc.php
        • ajax-fopen.php
      2. Files on Domain-B
        • ajax.php

Suppose Domain-A is the place where you show the data and Domain-B is the place where the data is coming from.

1.1. [regular] Cross Domain AJAX Request with GET method

index.html [1.1.1. - Domain-A]

script.js [1.1.1. - Domain-A]

ajax.php [1.1.2. - Domain-B]

—————————————————————————————————————–

1.2. [regular] Cross Domain AJAX Request with POST method

index.html [1.2.1. - Domain-A]

script.js [1.2.1. - Domain-A]

ajax.php [1.2.2. - Domain-B]


2.1. [special] Cross Domain AJAX Request with GET method

The main advantage of this php based special method over regular method is that, neither you need have access on Domain-B – nor Domain-B need to have CORS enabled. So, a cross domain AJAX call will be always successful even the ajax.php (here) is not being a public API.

index.html [2.1.1 - Domain-A]

script.js [2.1.1 - Domain-A]

ajax.php [2.1.1 - Domain-A]

ajax.php [2.1.2 - Domain-B]

2.2. [special] Cross Domain AJAX Request with POST method

This is the tricky part of this article. We’ll use PHP to post data instead of JavaScript. I’m showing you three ways to POST data using PHP and they are – 1. cURL, 2. file_get_contents and 3. fopen. Among three, cURL is highly recommended as cURL is fast, efficient and powerful. If your web host has cURL disabled, you still got two options remaining.

index.html [2.2.1 - Domain-A]

script.js [2.2.1 - Domain-A]

ajax-curl.php [2.2.1 - Domain-A]

ajax-fgc.php [2.2.1 - Domain-A]

ajax-fopen.php [2.2.1 - Domain-A]

ajax.php [2.2.2 - Domain-B]


I really enjoyed writing this article and hope this is useful for you.

If you have any problem, please comment below.

If you really like this article – please like, comment and share.

Thank you!

Comments

Leave a Reply