web-dev-qa-db-fra.com

Demande d'origine croisée bloquée lors du chargement du fichier local

Je développe actuellement un site Web et j'ai du mal à afficher mes icônes de police dans Firefox. tous les navigateurs, à l'exception de Firefox, peuvent charger et afficher mes icônes de police, mais sur Firefox, j'obtiens l'erreur suivante:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///C:/Users/Me/Desktop/website/resources/dist/css/fonts/themify.ttf. (Reason: CORS request not http).

le chemin d'accès au fichier est correct, car le navigateur me permet de télécharger le fichier lorsque j'entre l'URL indiquée ci-dessus. Quelqu'un sait pourquoi je reçois cette erreur?

htmlcssfirefoxfonts
13
user9533436

Comme mentionné dans la section des commentaires, j'ai installé un serveur Web. Dans mon cas, j'ai utilisé Tomcat8 et en utilisant cela, j'ai pu afficher les icônes même dans Firefox.

1
user9533436

Firefox 68 contient un correctif de sécurité qui restreint les types de fichiers que les pages peuvent charger (et les méthodes de chargement) lorsque vous les ouvrez à partir d'une URL file: //. Cette modification a été apportée pour empêcher l'exfiltration de données précieuses à portée d'une page locale, comme démontré dans un exploit disponible. Plus d'informations: https://developer.mozilla.org/docs/Web/HTTP/CORS/Errors/CORSRequestNotHttp

J'ai déposé hier un bug proposant que les polices soient autorisées, mais cela prendra du temps à implémenter. Pour l'instant, vous pouvez restaurer le patch comme suit:

(1) Dans un nouvel onglet, saisissez ou collez about: config dans la barre d'adresse et appuyez sur Entrée/Retour. Cliquez sur le bouton promettant d'être prudent ou acceptant le risque.

(2) Dans la zone de recherche au-dessus de la liste, tapez ou collez uniq et faites une pause pendant que la liste est filtrée

(3) Double-cliquez sur la préférence privacy.file_unique_Origin pour basculer la valeur de true à false

Pour atténuer la vulnérabilité: si vous enregistrez des pages de sites non approuvés dans un dossier distinct, par exemple Downloads\Untrusted, il serait difficile pour un attaquant de trouver du contenu utile à l'aide de liens de fichiers locaux.

11
Mahdy Aslamy

Le moyen le plus simple et le plus sûr de résoudre le problème temporaire (il devrait être corrigé dans la prochaine mise à jour de Firefox 68.0.2) avec des polices Web non chargées lors de la prévisualisation locale est d'installer la version .ttf ou .otf et de le lier dans votre @ font-face déclaration. Sous Windows, accédez à/Panneau de configuration/Polices/et vérifiez le nom exact de votre police, copiez-le dans la valeur local ('').

Exemple:

@font-face {    
   font-family: 'Clear Sans';    
   font-style: normal;    
   font-weight: 700;    
   src: local('Clear Sans Bold'),    
      url('../fonts/woff2-convert/ClearSans-Bold.woff2') format('woff2'),    
      url('../fonts/WOFF/ClearSans-Bold.woff') format('woff'),     
      url('../fonts/TTF/ClearSans-Bold.ttf') format('truetype')    
}
1
Pristy