CORS方式解决跨域

CORS 全称(Cross-Origin Resource Sharing)—跨域资源共享 

作用方式:它使用额外的 HTTP 头来告诉浏览器  让运行在一个 origin (domain) 上的Web应用被准许访问来自不同源服务器上的指定的资源。当一个资源从与该资源本身所在的服务器不同的域、协议或端口请求一个资源时,资源会发起一个跨域 HTTP 请求

为何要解决跨域:出于安全原因,浏览器限制从脚本内发起的跨源HTTP请求。 例如,XMLHttpRequest和Fetch API遵循同源策略。 这意味着使用这些API的Web应用程序只能从加载应用程序的同一个域请求HTTP资源,除非响应报文包含了正确CORS响应头。      

以上引自MDN

因为要在源头(即后端文件进行编写响应头),因此可以在PHP或者express中编写,且该方式支持get和post请求。 

PHP中编写

①在被请求网站加请求头 

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

②设置只允许一个网站来访问

header("Access-Control-Allow-Origin:https://www.ajax.com")

③设置允许三个网站来访问

$allow=['网站1','网站2','网站3']
//获取来访问网站的域名
$domain=$_SERVER['HTTP_ORIGIN']//获取的是完整的域名
$domain=$_SERVER['HTTP_REFERER']//获取的是完整的域名+后面参数
//判断来源域名是否在允许域名里面
if(in_array($domain.$allow)){
  header("Access=Control-Allow-Origin:".$domain)  
}
echo '...'

express中编写  

①通过npm下载相关组件

npm install cros

②使用该中间件

app.use( require('cros')())

③路由设置

res.set("Access-Contol-Allow-Origin","*")
原文地址:https://www.cnblogs.com/lufei910/p/12202136.html