Access Control Allow Origin http set Headers

Access Control Allow Origin http set Headers

Simple Include headers Uing CORS solution (Cross-origin resource sharing)

Welcome to the In Pakainfo.com website! You will Step By Step learn web programming, easy and very fun. This website allmost provides you with a complete web programming tutorial presented in an easy-to-follow manner. Each web programming tutorial has all the practical examples with web programming script and screenshots available.For Access Control Allow Origin http set Headers

Access-Control-Allow-Origin – Name of the each domain allowed access control all for cross domain requests. * (* means all domain allowed)indicates all domains are allowed.
Access-Control-Allow-Methods – List of (GET, PUT, POST, DELETE, OPTIONS)HTTP methods can be used here domains during request.
Access-Control-Allow-Headers – List of (GET, PUT, POST, DELETE, OPTIONS)HTTP headers can be used here domains during request.

Also Read :  How to create a Login page with PHP and MySQL

In PHP : “no ‘access-control-allow-origin’ header is present on the requested resource web api”

The Soltution of the no ‘access-control-allow-origin’ header is present on the requested resource web api in PHP.

// here include this three statement
header('Access-Control-Allow-Origin: *');  //all the methods access code
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS'); // all the resource and request get
header('Access-Control-Allow-Headers: Content-Type, Content-Range, Content-Disposition, Content-Description');

simple Below the sample code which handles Cross Domain AJAX POST requests: post.php

CORS works fine in all the latest browsers, but IE8 and IE9 don’t support this.

In order to use XDomainRequest in IE, request must be:
a). Only GET or POST
When Posting, the data will always be sent with a Content-Type of text/plain
b). Only HTTP or HTTPS
Protocol must be the same scheme as the calling page
c). Always asynchronous

Also Read :  VueJS Conditional Show And Hide, v-if multiple conditions

Step 1). Add the script in

<script type='text/javascript' src="http://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.1/jquery.xdomainrequest.min.js"></script>

Step 2). You need to set contentType value text/plain in $.ajax request.

 var contentType ="application/x-www-form-urlencoded; charset=utf-8";
 
if(window.XDomainRequest) //for IE8,IE9
    contentType = "text/plain";
 
$.ajax({
     url:"http://pakainfo.com/php/post.php",
     data:"name=king&age=28",
     type:"POST",
     dataType:"json",   
     contentType:contentType,    
     success:function(result)
     {
        alert("here Display all the Data from Server"+JSON.stringify(result));
     },
     error:function(jqXHR,textStatus,errorThrown)
     {
        alert("Error display :You can not any data send Cross Domain AJAX simple requests: "+errorThrown);
     }
    });
	

Below is the sample code, works in all the browsers.

<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="jquery.min.js"></script>
<script type='text/javascript' src="http://cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.1/jquery.xdomainrequest.min.js"></script>

</head>
<body>
 
<input id="get_methoddata" type="button"  value="Data Send X  -> Method GET"/>
<input id="post_methoddata" type="button" value="Data Send X -> Method POST" />
 
<script>
$(document).ready(function()
{
    var data_contentType ="application/x-www-form-urlencoded; charset=utf-8";
 
    if(window.XDomainRequest)
        data_contentType = "text/plain";
 
    $("#post_methoddata").click(function()
    {
        $.ajax({
         url:"http://pakainfo.com/php/post.php",
         data:"name=johan&age=28",
         type:"POST",
         dataType:"json",   
         contentType:data_contentType,    
         success:function(result)
         {
            alert("here Display all the Data from Server"+JSON.stringify(result));
         },
         error:function(jqXHR,textStatus,errorThrown)
         {
            alert("Error display :You can not any data send Cross Domain AJAX simple requests: "+errorThrown);
         }
        });
 
    });
 
    $("#get_methoddata").click(function()
    {
        $.ajax(
        {
         url:"http://pakainfo.com/php/get.php?name=johan&age=48",
         dataType:"json",
         contentType:contentType,
         success:function(result)
         {
            alert("all the Data from here display Server"+JSON.stringify(result));
         },
         error:function(jqXHR,textStatus,errorThrown)
         {
             alert("Error display :You can not any data send Cross Domain AJAX simple requests: "+errorThrown);
         }
        });
 
    });
 
});
</script>
</body>
</html>

post.php source code:

<?php
// here include this two statement
header('Access-Control-Allow-Origin: *'); 
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
 
 //check condition headers set or not
if(isset($HTTP_RAW_POST_DATA)) {
  parse_str($HTTP_RAW_POST_DATA,$arr); 
  $arr['data_extra']='task 1.your request POST Request from Pakainfo.com';
  echo json_encode($arr);
}
else
{
    $_POST['data_extra']='task 2.your request POST Request from Pakainfo.com';
    echo json_encode($_POST);
}
?>

Example

header set access-control-allow-origin multiple domains | cross domain ajax request,cross domain ajax request jquery | no access control allow origin header is present jquery ajax origin

Leave a Reply

Your email address will not be published. Required fields are marked *