什么是跨域访问

在A网站中,我们希望使用Ajax来获得B网站中的特定内容。如果A网站与B网站不在同一个域中,那么就出现了跨域访问问题。你可以理解为两个域名之间不能跨过域名来发送请求或者请求数据,否则就是不安全的。跨域访问违反了同源策略,

同源策略规定,浏览器的ajax只能访问跟它的HTML页面同源(相同域名或IP)的资源。

跨域

如何确定是跨域请求

A域名资源请求到B/C……域名

你当前访问的域名是http的当请求的部分资源是https的

当使用ajax访问远程服务器时,请求失败,浏览器报如上错误。这是出于安全的考虑,默认禁止跨域访问导致的。

如果是跨域访问,这时候就会报错

has been blocked by CORS policy: No 'Access-Control-Allow-Origin'

错误场景如:我的WordPress报错:Fonts –No 'Access-Control-Allow-Origin',已经提示我字体文件请求http url跨域了,然后根据我用的服务环境设置如下就行:

跨域访问解决

Apache

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

1

2

3

4

5

HeadersetAccess-Control-Allow-Origin"*"

Nginx

location ~* \.(eot|ttf|woff)$ {

add_header Access-Control-Allow-Origin '*';

}

1

2

3

location~*\.(eot|ttf|woff)${

add_headerAccess-Control-Allow-Origin'*';

}

Access-Control-Allow-Origin:* 表示允许任何域名跨域访问。

扩展

server {

listen 80;

server_name uedbox.com;

location / {

# Simple requests

if ($request_method ~* "(GET|POST)") {

add_header "Access-Control-Allow-Origin" *;

}

# Preflighted requests

if ($request_method = OPTIONS ) {

add_header "Access-Control-Allow-Origin" *;

add_header "Access-Control-Allow-Methods" "GET, POST, OPTIONS, HEAD";

add_header "Access-Control-Allow-Headers" "Authorization, Origin, X-Requested-With, Content-Type, Accept";

return 200;

}

....

# Handle request

....

}

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

server{

listen80;

server_nameuedbox.com;

location/{

# Simple requests

if($request_method~*"(GET|POST)"){

add_header"Access-Control-Allow-Origin"*;

}

# Preflighted requests

if($request_method=OPTIONS){

add_header"Access-Control-Allow-Origin"*;

add_header"Access-Control-Allow-Methods""GET, POST, OPTIONS, HEAD";

add_header"Access-Control-Allow-Headers""Authorization, Origin, X-Requested-With, Content-Type, Accept";

return200;

}

....

# Handle request

....

}

}

你还可以动态配置跨域方案

set $cors '';

if ($http_origin ~ '^https?://(localhost|www\.yourdomain\.com|www\.yourotherdomain\.com)') {

set $cors 'true';

}

if ($cors = 'true') {

add_header 'Access-Control-Allow-Origin' "$http_origin" always;

add_header 'Access-Control-Allow-Credentials' 'true' always;

add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;

add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With' always;

# required to be able to read Authorization header in frontend

#add_header 'Access-Control-Expose-Headers' 'Authorization' always;

}

if ($request_method = 'OPTIONS') {

# Tell client that this pre-flight info is valid for 20 days

add_header 'Access-Control-Max-Age' 1728000;

add_header 'Content-Type' 'text/plain charset=UTF-8';

add_header 'Content-Length' 0;

return 204;

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

set$cors'';

if($http_origin~'^https?://(localhost|www\.yourdomain\.com|www\.yourotherdomain\.com)'){

set$cors'true';

}

if($cors='true'){

add_header'Access-Control-Allow-Origin'"$http_origin"always;

add_header'Access-Control-Allow-Credentials''true'always;

add_header'Access-Control-Allow-Methods''GET, POST, PUT, DELETE, OPTIONS'always;

add_header'Access-Control-Allow-Headers''Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With'always;

# required to be able to read Authorization header in frontend

#add_header 'Access-Control-Expose-Headers' 'Authorization' always;

}

if($request_method='OPTIONS'){

# Tell client that this pre-flight info is valid for 20 days

add_header'Access-Control-Max-Age'1728000;

add_header'Content-Type''text/plain charset=UTF-8';

add_header'Content-Length'0;

return204;

}

不改动服务配置跨域解决

$ret = array(

'name' => isset($_POST['name'])? $_POST['name'] : '',

'gender' => isset($_POST['gender'])? $_POST['gender'] : ''

);

header('content-type:application:json;charset=utf8');

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

header('Access-Control-Allow-Methods:POST');

header('Access-Control-Allow-Headers:x-requested-with,content-type');

echo json_encode($ret);

?>

1

2

3

4

5

6

7

8

9

10

11

12

13

$ret=array(

'name'=>isset($_POST['name'])?$_POST['name']:'',

'gender'=>isset($_POST['gender'])?$_POST['gender']:''

);

header('content-type:application:json;charset=utf8');

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

header('Access-Control-Allow-Methods:POST');

header('Access-Control-Allow-Headers:x-requested-with,content-type');

echojson_encode($ret);

?>

如果需要指定某域名才允许跨域访问,只需把Access-Control-Allow-Origin:*改为Access-Control-Allow-Origin:允许的域名,例如:

header('Access-Control-Allow-Origin:https://www.uedbox.com');

1

header('Access-Control-Allow-Origin:https://www.uedbox.com');

如果需要设置多个域名允许访问,那么把多个域名放在数组中就可以,例如:

$ret = array(

'name' => isset($_POST['name'])? $_POST['name'] : '',

'gender' => isset($_POST['gender'])? $_POST['gender'] : ''

);

header('content-type:application:json;charset=utf8');

$origin = isset($_SERVER['HTTP_ORIGIN'])? $_SERVER['HTTP_ORIGIN'] : '';

$allow_origin = array(

'https://www.uedbox.com',

'https://www.uedbox.com'

);

if(in_array($origin, $allow_origin)){

header('Access-Control-Allow-Origin:'.$origin);

header('Access-Control-Allow-Methods:POST');

header('Access-Control-Allow-Headers:x-requested-with,content-type');

}

echo json_encode($ret);

?>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

$ret=array(

'name'=>isset($_POST['name'])?$_POST['name']:'',

'gender'=>isset($_POST['gender'])?$_POST['gender']:''

);

header('content-type:application:json;charset=utf8');

$origin=isset($_SERVER['HTTP_ORIGIN'])?$_SERVER['HTTP_ORIGIN']:'';

$allow_origin=array(

'https://www.uedbox.com',

'https://www.uedbox.com'

);

if(in_array($origin,$allow_origin)){

header('Access-Control-Allow-Origin:'.$origin);

header('Access-Control-Allow-Methods:POST');

header('Access-Control-Allow-Headers:x-requested-with,content-type');

}

echojson_encode($ret);

?>

至此,No 'Access-Control-Allow-Origin'问题解决!

扩展

php accesscontrolallowcredentials,No Access-Control-Allow-Origin 跨域错误解决相关推荐

  1. sliverlight 访问WCF服务跨域错误解决方法

    sliverlight访问wcf服务提示跨域错误! 一般是由于跨域文件不存在造成的,方法是创建XML 文件重命名为clientaccesspolicy(必须是这个名字)内容 <?xml vers ...

  2. WebApi Ajax 跨域请求解决方法(CORS实现)

    ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题, 特别各种A ...

  3. jsp允许跨域访问_Ajax跨域访问解决办法

    方法1. jsonp实现ajax跨域访问示例 jsp代码: js代码: functiontestJsonp(){ $.ajax({ type :'GET', dataType :'jsonp', // ...

  4. “网页内容无法访问”可能是跨域错误!

    5G 时代的宣传热火朝天,万物互联的生活沉浸到方方面面,网络资源的访问成了人们生活中不可或缺的存在.访问使用的多了也经常会遇到无法访问的情况,这个时候打开 Console 往往会看到下面这种红彤彤一片 ...

  5. 域,域名,同域,跨域及解决

    转载文章:web服务(同域和跨域)  作者:淘码小工  来源:简书 转载文章:关于跨域,以及跨域的几种方式   作者:陈诗烁 来源:博客园 域:Windows网络中独立运行的单位,域之间相互访问则需要 ...

  6. 什么是同源???跨域错误???如何解决???

    同源:指发出请求所在的页面 与 所请求的资源的url 协议相同,域名相同,端口相同. 跨域错误:指不同源的ajax请求. 浏览器向web服务器发起http请求时 ,如果同时满足以下三个条件时,就会出现 ...

  7. 谷歌新版本跨域错误深度剖析与解决:request client is not a secure context and the resource is in more-private address

    快速解决: ====================================================== 最近在测试http服务时,谷歌浏览器报了以下错误 "The requ ...

  8. mysql出现ERROR1698(28000):Access denied for user root@localhost错误解决方法

    mysql出现ERROR1698(28000):Access denied for user root@localhost错误解决方法 参考文章: (1)mysql出现ERROR1698(28000) ...

  9. 浏览器同源策略及跨域的解决方法

    浏览器同源策略及跨域的解决方法 参考文章: (1)浏览器同源策略及跨域的解决方法 (2)https://www.cnblogs.com/laixiangran/p/9064769.html 备忘一下.

最新文章

  1. 突发 | Yann LeCun卸任!Facebook变天,做AI不能落地是不成了
  2. mysql,int(5)、int(10)啥区别联系
  3. STM32延时函数的四种方法:普通延时(2种)、SysTick 定时器延时(2种)
  4. STM32---SPI通信的总结(库函数操作)
  5. OCCI读写Oracle Spatial的SDO_Geometry
  6. javascript --- 文件上传即时预览 闭包实现多图片即时预览
  7. HTML5常用标签及特殊字符表
  8. 创建三个并发进程linux,Linux下几种并发服务器的实现模式(详解)
  9. (转)C#中的委托(Delegate)和事件(Event)
  10. 小霸王被申请破产重整;虎牙员工自曝被HR抬出公司;Office 2010被微软终止服务|极客头条
  11. CVS文件的常见操作
  12. NYOJ 119 士兵杀敌(三) (线段树)
  13. 学校计算机的使用作文,电脑课上作文(3篇)
  14. hadoop2.6---常用命令
  15. 5分钟使用Unity制作AR应用,结合EasyAR制作AR
  16. 【第二剑-构建活动】代码应该怎么写?
  17. 重装系统后mysql不用重新安装
  18. 前端展示office
  19. ubuntu12.04宽带链接 以及 宽带链接后 再上局域网时出现的问题
  20. 启动Word 2019时弹出“很抱歉,此功能看似已中断,并需要修复......或是Excel 2019提示很抱歉,OFFICE安装出现问题

热门文章

  1. php web访问数据库,百宝箱之介绍PHP Web查询数据库基本步骤
  2. jQuery带有动画的返回顶部
  3. html中加粗的字体如何改细,css font-weight 属性设置文本字体的粗细
  4. win10自带的框选截图快捷键
  5. 关于多因子模型在基金市场中的应用
  6. Frps搭建内网穿透(服务器及客户端详细)
  7. denoted(denoted by)
  8. 桌面虚拟化中VDI和IDV的五大区别
  9. 基于java的圆通快递单号自动识别api接口代码实例
  10. 新浪开放平台:解决获取access_token抛 21323 异常,以及接口调用