I want to provide other sites with a banner from my site but I want to keep the banner on my server and have them include it with javascript, like Facebook plugins/google ads do.
The banner is hosted on site A. On site B I have this code:
<div id="bannerContainer"></div>
<script type="text/javascript" src="http://mysite.com/plugins/includebanner.js"></script>
includebanner.js does an AJAX call to get the banner and place it inside bannerContainer but I'm getting error:
Origin http://lventas.com is not allowed by Access-Control-Allow-Origin.
How do I allow all websites to include the banner? Are there other easy ways to include a banner hosted in site A from other site?
Edit:
This is the script that requests the content:
function ajax(url, id_contenedor)
{
var pagina_requerida = false;
if (window.XMLHttpRequest)
{
pagina_requerida = new XMLHttpRequest ();
} else if (window.ActiveXObject)
{
try
{
pagina_requerida = new ActiveXObject ("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
pagina_requerida = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e)
{
}
}
}
else
return false;
pagina_requerida.onreadystatechange = function ()
{
cargarpagina (pagina_requerida, id_contenedor);
}
pagina_requerida.open ('GET', url, true); // asignamos los métodos open y send
pagina_requerida.send (null);
}
function cargarpagina (pagina_requerida, id_contenedor)
{
if (pagina_requerida.readyState == 4 && (pagina_requerida.status == 200 || window.location.href.indexOf ("http") == - 1))
document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText;
}
ajax('http://lujanventas.com/plugins/banner/index.php', 'banner-root');