【前端】跨域 问题 原理 + 解决方案 上

起源：

错误是由于CORS跨域验证机制设置不正确导致的，但是上面的这个错误我得解决呀，不好办吗，本文结合各大……（广告时间）能说明白当然是不可能了，还需要点开文中链接看一看、瞧一瞧，当然偶尽量在本文中写滴清楚

 

这个前言让他有点特别吧，先写一下出现的几种问题：

No 'Access-Control-Allow-Origin' header is present on the requested resource,并且The response had HTTP status code 404

原因：（解决：后端允许options请求）

• 本次ajax请求是“非简单请求”，非简单请求？嘿嘿 见下文
• 服务器端后台接口没有允许OPTIONS请求,导致无法找到对应接口地址

 

No 'Access-Control-Allow-Origin' header is present on the requested resource,并且The response had HTTP status code 405

原因：（后端关闭对应的安全配置）

• 方法允许OPTIONS请求,但是一些配置文件中(如安全配置),阻止了OPTIONS请求

 

No 'Access-Control-Allow-Origin' header is present on the requested resource,并且status 200

原因：（后端增加对应的头部支持）

• 服务器端后台允许OPTIONS请求,并且接口也允许OPTIONS请求,但是头部匹配时出现不匹配现象

 

heade contains multiple values '*,*'

原因：

• 重复配置
• 常见于.net后台(一般在web.config中配置了一次origin,然后代码中又手动添加了一次origin(比如代码手动设置了返回*))： 建议删除代码中手动添加的*，只用项目配置中的即可
• 常见于.net后台(在IIS和项目的webconfig中同时设置Origin:*)：建议删除IIS下的配置*，只用项目的配置

 

正文：

浏览器安全的基石是"同源政策"（same-origin policy）

跨域：浏览器不能执行其他网站的脚本，由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制；

【源】

 

一、概述：

同源：

协议、域名、端口相同；

http://www.example.com/dir/page.html这个网址，协议是http://，域名是www.example.com，端口是80（默认端口可以省略）

• http://www.example.com/dir2/other.html：同源
• http://example.com/dir/other.html：不