.htaccess - origin - ¿Cómo puedo solucionar el problema de la extensión web de "Falta de cruce de recursos de origen(CORS) Response Header"?

razón encabezado cors access control allow origin faltante

Question

Por algún motivo, las fuentes han dejado de representar en mis sitios. Las fuentes se almacenan localmente, en el mismo servidor que el sitio.

Busqué el problema y parece ser un Missing Cross-Origin Resource Sharing (CORS) Response Header pero no puedo entender la solución para esto.

Todos los sitios dicen que hacer es usar: Access-Control-Allow-Origin:*

Pero como estoy principalmente al frente, no sé dónde ponerlo. ¿Es esto algo con lo que mi anfitrión puede ayudar?

¿Qué puedo hacer para solucionar el problema?

EDITAR:

el sitio en cuestión es: http://cyclistinsuranceaustralia.com.au/

El número de teléfono, por ejemplo, en la esquina superior derecha debería ser una fuente Bebas, pero está configurada por defecto en Impact.

En la consola, obtengo los errores:

La fuente del origen '' http://www.cyclistinsuranceaustralia.com.au '' ha sido bloqueada para que no se cargue por la política de Intercambio de recursos de origen cruzado: El encabezado ''Control de acceso-Permitir-Origen'' tiene un valor '' http: // www. cyclistinsuranceaustralia.com.au ''que no es igual al origen proporcionado. El origen '' http://cyclistinsuranceaustralia.com.au/ '' no está, por lo tanto, permitido.

Me comunico con mi anfitrión, quien me dijo:

Access-Control-Allow-Origin "http://www.cyclistinsuranceaustralia.com.au"

en mi archivo .htaccess, pero esto no tiene ningún cambio.

Answer 1

En su HTML, ha establecido una etiqueta "base":

<base href="http://www.cyclistinsuranceaustralia.com.au/">

1. Elimina esa línea de tu HTML si no la necesitas. Esto debería hacer que las fuentes funcionen cuando se vean desde http://cyclistinsuranceaustralia.com.au/ .
2. Probablemente necesites redirigir http://www.cyclistinsuranceaustralia.com.au a http://cyclistinsuranceaustralia.com.au/

Answer 2

En su caso particular, parece que el problema es acceder al sitio desde una URL no canónica (www.site.com vs. site.com).

En lugar de solucionar el problema CORS (que puede requerir el proxy de fuentes del servidor con los encabezados CORS correctos dependiendo del proveedor del servicio) puede normalizar sus Urls para server siempre el contenido en Url canónica y simplemente redirigir si uno solicita una página sin "www."

Alternativamente, puede subir fuentes a diferentes servidores / CDN que se sabe que tienen encabezados CORS configurados o puede hacerlo fácilmente.

Answer 3

Si solo está interesado en el uso de Access-Control-Allow-Origin:*

Puede hacerlo con este archivo .htaccess en la raíz del sitio.

Header set Access-Control-Allow-Origin "*"

Alguna información útil aquí: http://enable-cors.org/server_apache.html

Answer 4

Tuvimos este problema exacto con fontawesome-webfont.woff2 lanzando un error 406 en un host compartido (Cpanel). Estaba trabajando en el elusivo "dominio sin cookies" para un proyecto de Wordpress Multisite y mis páginas "www.domain.tld" tendrían el siguiente error (3 veces) en Chrome:

La fuente del origen '' http: //static.domain.tld '' ha sido bloqueada por la política de intercambio de recursos de origen cruzado: Ningún encabezado ''Access-Control-Allow-Origin'' está presente en el recurso solicitado. El origen '' http: //www.domain.tld '' no está, por lo tanto, permitido.

y en Firefox, un poco más de detalle:

fuente descargable: descarga fallida (font-family: estilo "FontAwesome": peso normal: estiramiento normal: índice src normal: 1): URI incorrecto o acceso entre sitios no permitido fuente: http://static.domain.tld/wp-content/themes/some-theme-here/fonts/fontawesome-webfont.woff2?v=4.7.0
font-awesome.min.css: 4: 14 Solicitud de origen cruzado bloqueada: la misma política de origen no permite leer el recurso remoto en http://static.domain.tld/wp-content/themes/some-theme-here/fonts/fontawesome-webfont.woff?v=4.7.0 . (Motivo: Falta el encabezado CORS ''Acceso-Control-Permitir-Origen'').

Llegué a QWANT-around (QWANT.com = fantástico) y encontré esta publicación SO:

Subdominios, puertos y protocolos de comodines Access-Control-Allow-Origin

Una hora en el chat con diferentes miembros del personal de soporte de Host Compartido (uno ni siquiera sabía acerca de F12 en un navegador ...) y luego esperaba una respuesta al ticket que se cortó después de no disfrutar mientras jugaba con mod_security. Intenté improvisar el código para el archivo .htaccess junto con la publicación mientras tanto, y conseguí que esto funcionara para remediar los errores 406, sin problemas:

    <IfModule mod_headers.c>
    <IfModule mod_rewrite.c>
        SetEnvIf Origin "http(s)?://(.+/.)?domain/.tld(:/d{1,5})?$" CORS=$0
        Header set Access-Control-Allow-Origin "%{CORS}e" env=CORS
        Header merge  Vary "Origin"
    </IfModule>
    </IfModule>

Lo agregué a la parte superior de mi .htaccess en la raíz del sitio y ahora tengo un nuevo tío llamado Bob. (*** Por supuesto, cambie las partes de domain.tld a lo que sea que su dominio con el que está trabajando sea ...)

Aunque mi parte FAVORITA de esta publicación es la capacidad de RegEx O (|) varios sitios en este CORS "hackear" haciendo:

Para permitir sitios múltiples:

SetEnvIf Origin "http(s)?://(.+/.)?(othersite/.com|mywebsite/.com)(:/d{1,5})?$" CORS=$0

Esta solución honestamente me dejó maravillada porque me he encontrado con este problema antes, trabajando con Dev''s en las compañías Fortune 500 que son MILES sobre mi base de conocimiento de Apache y no pude resolver problemas como este sin hacer que TI modifique la configuración de Apache.

Esta es la solución mágica para solucionar todos los problemas de CDN con dominios sin cookies (o casi sin cookies si usa CloudFlare ...) para reducir la cantidad de tráfico innecesario en la web de las cookies que se envían con cada solicitud de imagen solamente para ser abandonado como una mala cita a ciegas por el servidor.

Super seguro, súper elegante. Me encanta: no tiene que abrir el ancho de banda de sus servidores a los tipos de ladrones de recursos / hot-link-er.

Apoyos a un esfuerzo colectivo de estas 3 mentes brillantes por resolver lo que una vez se pensó que no se podía resolver con .htaccess, del cual reconstruí este código a partir de:

@Noyo https://.com/users/357774/noyo

@DaveRandom https://.com/users/889949/daverandom

@ pratap-koritala https://.com/users/4401569/pratap-koritala

Answer 5

Voy a suponer que su anfitrión está usando C-Panel, y que probablemente sea HostGator o GoDaddy. En ambos casos, usan C-Panel (de hecho, lo hacen muchos hosts) para que la administración del servidor sea lo más fácil posible para usted, el usuario final. Incluso si está alojando a través de otra persona, vea si puede iniciar sesión en algún tipo de panel de administración y encontrar un archivo .htaccess que pueda editar. (Nota: el período anterior simplemente significa que es un archivo / directorio "oculto").

Una vez que encuentre el archivo htaccess, agregue la siguiente línea:

1. Header set Access-Control-Allow-Origin "*" Solo para ver si funciona. Advertencia: No use esta línea en un servidor de producción

Deberia de funcionar. De lo contrario, llame a su anfitrión y pregúnteles por qué la línea no funciona; probablemente puedan ayudarlo rápidamente desde allí.

2. Una vez que tenga el trabajo anterior, cambie el * a la dirección del dominio solicitante http://cyclistinsuranceaustralia.com.au/ . Es posible que encuentre un problema con el direccionamiento canónico (incluido el www) y, si es así, es posible que deba configurar su host para una redirección. Sin embargo, ese es un puente diferente y más pequeño para cruzar. Al menos estarás en el lugar correcto.

Answer 6

tuvimos un problema de encabezado similar con Amazon (AWS) S3 prescrito Error de publicación en algunos navegadores.

punto era decirle a CORS cubo para exponer el encabezado <ExposeHeader>Access-Control-Allow-Origin</ExposeHeader>

más detalles en esta respuesta: https://.com/a/37465080/473040