font-face字体文件跨域解决办法

网站建设 2022-07-27 08:13www.1681989.com免费网站
我们在访问二级域名访问一级域名的字体文件有时,浏览器会阻止并报提示 已拦截跨源请求同源策略禁止读取位于 https://.dedesos./fonts/fontawesome-webfont.woff?v=4.7.0 的远程资源。(原因CORS 头缺少 Aess-Control-Allow-Orig) 已拦截跨源请求同源策略禁止读取位于 https://.dedesos./fonts/fontawesome-webfont2.woff?v=4.7.0 的远程资源。(原 […]



我们在访问二级域名访问一级域名的字体文件有时,浏览器会阻止并报提示

已拦截跨源请求同源策略禁止读取位于 https://.dedesos./fonts/fontawesome-webfont.woff?v=4.7.0 的远程资源。(原因CORS 头缺少 'Aess-Control-Allow-Orig')

已拦截跨源请求同源策略禁止读取位于 https://.dedesos./fonts/fontawesome-webfont2.woff?v=4.7.0 的远程资源。(原因CORS 头缺少 'Aess-Control-Allow-Orig')

原因很简单,服务器阻止了字体跨域访问了,解决方法也很简单

第一种方法把字体文件放到二级目录里,用二级目录的域名链接css文件

例如

<lk rel="stylesheet" href="https://m.dedesos//font/font-awesome.m.css">

第二种方法在主域名的环境配置文件里加入允许字体跨域

apache环境 域名conf文件里加入

Header set Aess-Control-Allow-Orig ""

ngx环境 域名conf文件里加入

location ~ \.(ttf|ttc|otf|eot|woff|woff2|font.css)$ {
	add_header Aess-Control-Allow-Orig ;
}

IIS环境 确保iis网站上已经添加me类型

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff woff

再打开 HTTP 响应标头中添加

名称:Aess-Control-Allow-Orig

值:

重启iis


Copyright © 2016-2025 www.1681989.com 推火网 版权所有 Power by