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. Origin http://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
Advertisement
Answer
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….