0

Estoy tratando de hacer un widget en el cual me tiene que traer los datos una lista de productos.

scrip.js

var cssId = 'myCss';
if (!document.getElementById(cssId))
{
var head  = document.getElementsByTagName('head')[0];
var link  = document.createElement('link');
link.id   = cssId;
link.rel  = 'stylesheet';
link.type = 'text/css';
link.href = 'https://sitioweb.com/stylesheet.css';
link.media = 'all';
head.appendChild(link);
}

var xhr = new XMLHttpRequest();
xhr.open("GET", "https://sitioweb.com/datos.php");
xhr.onload = function () {
if (xhr.status == 200) {
    var json = JSON.parse(xhr.responseText);
    var template = "";
    template += '<div id="titulo">Aconcagua Insumos</div>';
    json.map(function(item){
        template += item.nombre + " <span>"+ item.cateId + "</span><br>";
        return template;    
        });
        template += '<div id="foot">Pie de pagina<br><a href="">Aconcagua Insumos</a></div>';   
            document.getElementById("LasnaInsumos_1c3155cceb757fc23f43c7815a1705a3").innerHTML = template;
} else {
    console.log("Error: "+xhr.status);
}
}
xhr.send();

Html

<div class="widget" id="LasnaInsumos_1c3155cceb757fc23f43c7815a1705a3"></div>
<script src="https://sitioweb.com/script.js"></script>

No me trae resultados, solo el estilo y el mensaje de error en la consola es:

Pedido de origen cruzado bloqueado: La política de mismo origen no permite leer el recurso remoto en https://sitioweb.com/datos.php. (Razón: encabezado CORS 'Access-Control-Allow-Origin' faltante).

Como puedo resolverlo? Gracias!

2
  • Lo estas probando en local? el 3 feb. 2019 a las 4:54
  • La página da error 403.
    – user13558
    el 3 feb. 2019 a las 6:30

1 respuesta 1

1

puedes corregirlo enviado xhr.setRequestHeader() con los valores de tu servidor: y te quedaria algo asi debes corregirlos es solo un ejemplo:

var cssId = 'myCss';
if (!document.getElementById(cssId))
{
var head  = document.getElementsByTagName('head')[0];
var link  = document.createElement('link');
link.id   = cssId;
link.rel  = 'stylesheet';
link.type = 'text/css';
link.href = 'https://sitioweb.com/stylesheet.css';
link.media = 'all';
head.appendChild(link);
}

var xhr = new XMLHttpRequest();
xhr.open("GET", "https://sitioweb.com/datos.php");
xhr.setRequestHeader('X-Alt-Referer', 'https://sitioweb.com/');
xhr.setRequestHeader('Host' , 'https://sitioweb.com/');
xhr.setRequestHeader('origin', 'https://sitioweb.com/');
xhr.setRequestHeader('Referer', 'https://sitioweb.com/');
xhr.onload = function () {
if (xhr.status == 200) {
    var json = JSON.parse(xhr.responseText);
    var template = "";
    template += '<div id="titulo">Aconcagua Insumos</div>';
    json.map(function(item){
        template += item.nombre + " <span>"+ item.cateId + "</span><br>";
        return template;    
        });
        template += '<div id="foot">Pie de pagina<br><a href="">Aconcagua Insumos</a></div>';   
            document.getElementById("LasnaInsumos_1c3155cceb757fc23f43c7815a1705a3").innerHTML = template;
} else {
    console.log("Error: "+xhr.status);
}
}
xhr.send();
2
  • ¿Estás seguro? El encabezado Host y el encabezado Origin no se pueden establecer manualmente. Puedes leer en Nombre de encabezado prohibido la lista de los encabezados que no pueden cambiarse mediante programación. el 3 feb. 2019 a las 18:55
  • Gracias Bryro por la respuesta, voy a probarlo, pero ayer justamente buscando encontré que había que poner esto: header('Access-Control-Allow-Origin: *'); al principio del PHP y funciono. Por ahora todas las pruebas son de forma local, voy a ir probando con la web del cliente.
    – Sebastian
    el 3 feb. 2019 a las 23:15

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.