El acceso a la fuente en el origen ha sido bloqueado por la política de CORS: no hay un encabezado ‘Access-Control-Allow-Origin’ en el recurso solicitado

2 minutos de lectura

avatar de usuario
Poonia Ujjawal

Tengo dos problemas en mi sitio web:

1) Contenido mixto: la página en ‘https://www.misitioweb.com/‘ se cargó a través de HTTPS, pero solicitó una fuente no segura ‘http://demo.kallyas.net/ares-furniture-interior-design/wp-content/uploads/sites/6/2016/03/montserrat-light-webfont.woff‘. Este contenido también debe servirse a través de HTTPS.

2) Acceso a la fuente en ‘https://kallyas.net/demo-ares/furniture/wp-content/uploads/sites/6/2016/03/montserrat-light-webfont.woff‘desde el origen’https://www.misitioweb.com‘ ha sido bloqueado por la política CORS:

No hay ningún encabezado ‘Access-Control-Allow-Origin’ en el recurso solicitado.

Yo he tratado:

<IfModule mod_rewrite.c>
Header set Access-Control-Allow-Origin "*"
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

&

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET,PUT,POST,DELETE"
Header set Access-Control-Allow-Headers "Content-Type, Authorization"

pon este código en tu archivo .htaccess y pruébalo

<IfModule mod_headers.c>
   Header set Access-Control-Allow-Origin "*"
</IfModule>
<FilesMatch ".(eot|ttf|otf|woff)">
   Header set Access-Control-Allow-Origin "*"
</FilesMatch>

Puede agregar un encabezado particular a la respuesta del servidor que indica al navegador que permita obtener un recurso en particular (fuente, imagen, etc.) editando el .htaccess archivo en la carpeta raíz del servidor (o donde está su sitio web):

<IfModule mod_headers.c>
  <FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css)$">
     Header set Access-Control-Allow-Origin "*"
  </FilesMatch>
</IfModule>

La línea de expresión regular (ttf|ttc|otf|eot|woff|woff2|font.css) significa que agregaremos este encabezado a la respuesta cuando sirvamos archivos con tales extensiones y cada archivo CSS, que comienza con “fuente” y termina con “css” (el punto representa ningún carácter, porque no se escapa).

Según mi experiencia, esta es la forma más efectiva y sencilla de resolver el problema.

  • técnicamente, la font.css regex mostrado coincide con cualquier archivo que termina con fontcss. Una expresión regular mejor (?) para un archivo que comienza con font y termina con .css sería ^font.*\.css$.

    – José Mejilla

    26 de marzo a las 20:59

¿Ha sido útil esta solución?