现在开发一个聊天室，聊天室客户端是独立在一个服务器上，而接口部分是以lumen框架开发，想要快速在聊天页面初始化的时候获取聊天记录列表，直接ajax跨域无疑是最简单的方法。
根据官方文档https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
前台跨域post请求，由于CORS（cross origin resource share）规范的存在，浏览器会首先发送一次options嗅探，同时header带上origin，判断是否有跨域请求权限，服务器响应access control allow origin的值，供浏览器与origin匹配，如果匹配则正式发送post请求。
根据lumen框架的特点，我们可以写一个中间件，然后在配置路由访问控制器的时候，先进行处理，设置Access-Control-Allow-Origin，规定好可以跨域请求本接口的站点。
/**
* 处理ajax跨域
*/
namespace App\Http\Middleware;
use Illuminate\Http\Request;
use Illuminate\Http\Response;
class CorsMiddleware
{
private $headers;
private $allow_origin;
public function handle(Request $request, \Closure $next)
{
$this->headers =
[
'Access-Control-Allow-Methods' => 'POST,GET,OPTIONS,DELETE',
'Access-Control-Allow-Headers' => $request->header('Access-Control-Request-Headers'),
'Content-Type' => 'text/html; charset=utf-8',
'Access-Control-Allow-Credentials' => 'true',//允许客户端发送cookie
'Access-Control-Max-Age' => 1728000 //该字段可选，用来指定本次预检请求的有效期，在此期间，不用发出另一条预检请求。
];
//设置有效请求来源
$this->allow_origin =
[
'http://chat.riluozhiguo.cn'
];
$origin = isset($_SERVER['HTTP_ORIGIN']) ? $_SERVER['HTTP_ORIGIN'] : '';
//如果origin不在允许列表内，直接返回403
if (!in_array($origin,$this->allow_origin)) {
return new Response('Forbidden', 403);
}
$this->setCorsHeaders($origin);
//如果是初次请求直接终止
if ($request->isMethod('options')) {
return ;
}
$response = $next($request);
return $response;
}
/**
* 设置Access-Control-Allow-Origin
* Typecho Blog Platform
* @copyright [copyright]
* @license [license]
* @version [version]
* @param [type] $response [description]
* @param [type] $origin [description]
*/
public function setCorsHeaders($origin)
{
foreach ($this->headers as $key => $value) {
header($key.':'.$value);
}
if (in_array($origin, $this->allow_origin)) {
header('Access-Control-Allow-Origin:'.$origin);
}
}
}
不过这里要注意，客户端ajax发送的数据格式以及编码一定要和接口端对应，否则即使处理成功，返回的数据也会出现在请求错误的状态之中。
网友评论