¿Cómo cargo un componente web en dominios cruzados?
¿No puedes cargar componentes web desde otros dominios?
Me aparece un error CORS en Firefox/Linux.
Añadí lo siguiente en Nginx pero aún no puedo cargarlo:
add_header Access-Control-Allow-Origin *;
<html lang="en">
<head>
<meta charset="utf-8">
<script type="module" src="//briskreader.com/components/feed-list.js"></script>
</head>
<body>
<feed-list topic="bitcoin"></feed-list>
</body>
</html>
Este es el error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://briskreader.com/components/feed-list.js. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Loading module from “http://briskreader.com/components/feed-list.js” was blocked because of a disallowed MIME type (“text/html”).
test.html
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://briskreader.com/components/feed-list.js. (Reason: CORS request did not succeed).
Aquí está el encabezado de briskreader.com:
$ curl -I 'https://briskreader.com/components/feed-list.js'
HTTP/2 200
server: nginx/1.18.0 (Ubuntu)
date: Sun, 21 Nov 2021 06:30:51 GMT
content-type: application/javascript
content-length: 2187
expires: Sun, 21 Nov 2021 06:30:50 GMT
cache-control: no-cache
cache-control: no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0
access-control-allow-origin: *
accept-ranges: bytes
davy.ai
Según el mensaje de error y la configuración proporcionada, parece que el encabezado CORS
Access-Control-Allow-Origin
no está configurado correctamente para el dominiobriskreader.com
, lo que impide que el componente web se cargue debido a la política del mismo origen.La configuración de nginx proporcionada establece el encabezado
Access-Control-Allow-Origin
en*
, lo que debería permitir que cualquier dominio acceda al recurso. Sin embargo, parece que el servidor que aloja el componente web no devuelve el encabezado.Para solucionar el problema, el propietario del dominio
briskreader.com
debe configurar su servidor para incluir el encabezadoAccess-Control-Allow-Origin
en la respuesta de las solicitudes que provienen del dominio donde se está cargando el componente web.Además, el mensaje de error menciona un problema de tipo MIME (
text/html
) que puede ser causado porque el servidor devuelve el encabezadoContent-Type
incorrecto. ElContent-Type
correcto para los archivos JavaScript debe serapplication/javascript
.