<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>webservices example </title>
<link rel="stylesheet" href="jquery.mobile-1.1.0.css" />
<link rel="stylesheet" href="my.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
type:"GET",
url:"http://shoperola.com/Restaurant/foodysrest/sample",
crossDomain: true,
contentType: "application/json; charset=utf-8",
dataType: "json",
xhrFields: {
withCredentials: true
},
beforeSend: function (request) {
request.setRequestHeader("Access-Control-Allow-Origin: ", "*")
},
success: function(data) {
alert(data);
},
error: function(data) {
alert("Error in Processing-----" + data.status);
}
});
});
</script>
</head>
</html>
" XMLHttpRequest cannot load http://shoperola.com/Restaurant/foodysrest/sample?{}. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://:8088' is therefore not allowed access".
you are trying to perform
XMLHttpRequest(AJAX)to another domain.This is restricted due to security reasons.
for more details see: http://en.wikipedia.org/wiki/Cross-origin_resource_sharing