Error on cross request: “Origin is not allowed by Access-Control-Allow-Origin”?

Question

I'm trying to load content from one of my sites in another:

<div id='include-from-outside'></div>
<script type='text/javascript'>
  $('#include-from-outside').load('http://lujanventas.com/plugins/banner/index.php&callback=?');
</script> 

But I'm getting this error:

XMLHttpRequest cannot load http://lujanventas.com/plugins/banner/index.php&callback=?. Origin http://lventas.com is not allowed by Access-Control-Allow-Origin.

How can I prevent it from happening?

Answer 1

There are two options:

1: make http://lujanventas.com return proper CORS headers -- http://enable-cors.org/

2: request the html using your server instead of with js in the browser -- http://www.daniweb.com/web-development/php/code/216729/php-proxy-solution-for-cross-domain-ajax-scripting

Answer 2

The url you are using suggests the site supports JSONP (see http://en.wikipedia.org/wiki/JSONP ). If so, you should be able to do it like this:

<script type="text/javascript">
    function handleResponse(json){
       var data = JSON.parse(json);
       ...handle data...
    }
</script>
<script src="http://lujanventas.com/plugins/banner/index.php?callback=handleResponse"></script>

Answer 3

使用jquery ajax来查询加载lujaventas内容的php文件，然后ajax回调将是lujaventas内容。