By Ganesh Babu


2013-08-22 14:04:02 8 Comments

I am trying to post form data from www.siteone.com to www.sitetwo.com via CORS. My ajax code is this:

<script>
$(document).ready(function(){
        $("#submit").live('click',function() {
            var url = "http://www.sitetwo.com/cors.php";
            var data = $('#form').serialize();
            jQuery.ajax({
                url : url,
                type: "POST",
                data : $('#form').serialize(),
                }).done(function(response){
                    alert(response);
                    }).fail(function(error){
                    console.log(error.statusText);
                    });
                return false;


});
});
</script>

and the file cors.php in www.sitetwo.com is as follows:

<?php
 header('Access-Control-Allow-Origin: *');
 header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
 echo "hai";
?>

But still Access-control-Allow-Origin error is thrown. The error thrown is this:

XMLHttpRequest cannot load http://www.sitetwo.com/cors.php.%20Origin%20http://www.siteone.com is not allowed by Access-Control-Allow-Origin. 

I came to know that, using CORS by just allowing the remote website via headers, we can use cross-domain request. But when I tried like this, error is thrown. Have I missed anything in here? Here is my request/response headers:

Response Headers
Connection  Keep-Alive
Content-Length  487
Content-Type    text/html; charset=iso-8859-1
Date    Fri, 23 Aug 2013 05:53:20 GMT
Keep-Alive  timeout=15, max=99
Server  Apache/2.2.15 (CentOS)
WWW-Authenticate    Basic realm="Site two Server - Restricted Area"
Request Headers
Accept  */*
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Content-Length  43
Content-Type    application/x-www-form-urlencoded; charset=UTF-8
Host    www.sitetwo.com
Origin  http://www.siteone.com
Referer http://www.siteone.com/index.html
User-Agent  Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:23.0) Gecko/20100101 Firefox/23.0

1 comments

@Ganesh Babu 2013-08-23 09:44:41

Finally, I myself have solved the problem explained in the question. The code that I have implemented for accessing header is incorrect.

The below mentioned two line code, when given, didn't work:

<?php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
?>

But handling CORS requests properly is a tad more involved. Here is a function that will respond more fully. The updated code is this :

 <?php
    // Allow from any origin
    if (isset($_SERVER['HTTP_ORIGIN'])) {
        header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
        header('Access-Control-Allow-Credentials: true');
        header('Access-Control-Max-Age: 86400');    // cache for 1 day
    }

    // Access-Control headers are received during OPTIONS requests
    if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {

        if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
            header("Access-Control-Allow-Methods: GET, POST, OPTIONS");         

        if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
            header("Access-Control-Allow-Headers:        {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");

        exit(0);
    }

    echo "You have CORS!";
?>

I have found from another post It worked....

@mplungjan 2013-08-27 15:04:51

Would LOVE to know why this was voted down!

@Ganesh Babu 2013-08-28 09:32:12

@mplungjan may be I've got vote down because of the answer prevailing in some other page.. But I have solved my question and found the answer after a long analysis referring to other posts. Its still unwelcome by the community..

@mplungjan 2013-08-28 09:35:06

Or perhaps because you posted a solution yourself after a lengthy discussion, but still it is idiotic to downvote without telling why. Perhaps there was an important technical reason to do so. Now we will never know and only suspect your solution due to a downvote

@Ganesh Babu 2013-08-28 11:40:25

@mplungjan I have posted answer only after a day I posted this question. CORS haven't worked for me earlier. Everywhere in web, you can find only the two line header code found in question(php file). We should add some more to it for getting it enabled. Anyway, I have posted my answer only after it worked.

@Bojangles 2013-09-24 12:24:27

I'd wager it's because Access-Control-Allow-Origin: * is wonderfully, beautifully, fantastically insecure

@duskstriker 2014-02-11 00:36:20

I agree that "Access-Control-Allow-Origin: *" is insecure but it is important to verify functionality first before locking things down. Everyone please lock down Access-Control-Allow-Origin after you get things up and running! :)

@Karl 2014-02-12 17:33:25

I have had issues with firefox using Access-Control-Allow-Origin: * It seems like FF wants the actual origin in the resoponse header not a wildcard, even though CORS, and Mozilla state that it should work on GET requests.

@Mimouni 2014-05-14 21:35:53

@Ganesh: ooooh man that's works perfecly now. thank you thank you +1

@manishKungwani 2014-10-07 10:24:09

YOU ARE THE MAN!

@MarcoS 2015-01-30 15:53:57

Thanks!!! Spent one full day before finding your answer... :-(

@Ezeewei 2016-08-18 23:11:48

@duskstriker how to lock it down? so I can actually specific domains? is this the only way? stackoverflow.com/questions/1653308/… or there is better way to just config that header?

@padawanTony 2016-09-15 11:23:34

@GaneshBabu While this solution works, it should be noted that not all browsers support the $_SERVER[HTTP_ORIGIN] and also it may not work in some specific requests. Here is an answer that adheres to W3C recommendations: stackoverflow.com/questions/1653308/…

Related Questions

Sponsored Content

7 Answered Questions

[SOLVED] How does PHP 'foreach' actually work?

15 Answered Questions

[SOLVED] Response to preflight request doesn't pass access control check

18 Answered Questions

[SOLVED] Reference — What does this symbol mean in PHP?

16 Answered Questions

28 Answered Questions

[SOLVED] How can I prevent SQL injection in PHP?

5 Answered Questions

[SOLVED] Add Header in AJAX Request with jQuery

11 Answered Questions

[SOLVED] How does Access-Control-Allow-Origin header work?

23 Answered Questions

[SOLVED] jQuery $.ajax(), $.post sending "OPTIONS" as REQUEST_METHOD in Firefox

12 Answered Questions

[SOLVED] AngularJS performs an OPTIONS HTTP request for a cross-origin resource

Sponsored Content