利用 Access-Control-Allow-Origin 响应头解决跨域请求

为了获得最大的性能,大家都知道,我们可以把我们的静态文件放到另一个 CDN 上。 随着这些静态文件是自定义的 Web 字体。 不幸的是通过 CDN(或任何跨域字体请求)自定义的 Web 字体都不能在 Firefox 或 Internet Explorer 正常的工作,虽然它们在基于 Webkit 的浏览器上工作。 他们居然需要自定义 CORS 系统配置,以正确显示。 这里有你需要做到这一点的代码。

利用 Access-Control-Allow-Origin 响应头解决跨域请求

设置 .htaccesshttpd.conf

该代码可以放在与 .htaccess 文件或 httpd.conf 的文件:

# Apache config

<FilesMatch ".(eot|ttf|otf|woff)">

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

</FilesMatch>

# nginx config

if ($filename ~* ^.*?\.(eot)|(ttf)|(woff)$){

    add_header Access-Control-Allow-Origin *;

}

这将设置 Access-Control-Allow-Origin 系统配置,以允许所有的域。 列表以逗号隔开,如果你想为字体最多只有特定的域。 你要适当地服侍了所有的字体类型,浏览器偏好一类的情况。 为确保头设置正确,您可以使用下面的代码测试:

$ curl -I https://some.cdn.otherdomain.net/media/fonts/somefont.ttf

# Result

HTTP/1.1 200 OK

Server: Apache

X-Backend-Server: developer1.webapp.scl3.mozilla.com

Content-Type: text/plain; charset=UTF-8

Access-Control-Allow-Origin: *

ETag: "4dece1737ba40"

Last-Modified: Mon, 10 Jun 2013 15:04:01 GMT

X-Cache-Info: caching

Cache-Control: max-age=604795

Expires: Wed, 19 Jun 2013 16:22:58 GMT

Date: Wed, 12 Jun 2013 16:23:03 GMT

Connection: keep-alive

如果你看到 Access-Control-Allow-Origin: * 在响应中的代码中,那么就配置成功了,同样的策略是使用自举的CDN ,所以你知道它的好

如果你想在你的 PHP 文件中实现,那么需要先设置 header 函数文件头信息

header("Access-Control-Allow-Origin: *");

以上是 利用 Access-Control-Allow-Origin 响应头解决跨域请求 的全部内容, 来源链接: utcz.com/p/231832.html

回到顶部