技术知识分享

Nginx跨域加载资源教程

腾讯云双11活动

今天小白设置了wordpress静态资源CDN分离,设置过程中发现字体文件是没法简单分离的。需要在CDN端设置跨域访问,不然无法加载字体文件。代码我都已经准备好了。有需要的同学直接使用下面的代码即可。

跨域无权限报错:No ‘Access-Control-Allow-Origin’ header is present on the requested resource ,则需要使用本教程。

如果你是宝塔面板。则需要在CDN端使用以下代码。
代码放置于宝塔面板 – 网站 – 设置 – 配置文件 ,root下即可。

如果只需要一个网址跨域,代码如下:

add_header 'Access-Control-Allow-Origin' 'https://pc6a.com';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Requested-With';
add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS';

如果需要放行所有跨域网址,则把 https://pc6a.com ,替换为 * 即可。

如果需要2个或者多个网址跨域,代码如下:

#跨域支持
location / {
set $match "";
# 支持http及https
if ($http_origin ~* 'https?://(pc6a.com|yangmao.info)') {
set $match "true";
}

if ($match = "true") {
add_header Access-Control-Allow-Origin "$http_origin";
add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
add_header Access-Control-Allow-Methods GET,POST,OPTIONS,DELETE;
add_header Access-Control-Allow-Credentials true;
}
# 处理OPTIONS请求
if ($request_method = 'OPTIONS') {
return 204;
}
}

其中pc6a.com和yangmao.info请替换为自己的域名。多个域名使用 | 区隔。

 

未经允许不得转载:pc6a学习分享 » Nginx跨域加载资源教程
阿里云服务器11月抢购

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址