Laravel框架的前后端分离的跨域CORS问题处理
- 2913
- PHP
- 0
- super_dodo
- 2020/10/15
最近处理的一个项目是laravel+vue的项目,原先的时候是吧前端项目放在后端代码的public目录下面,放在同一个目录下面的话是不会存在跨域相关的问题。
现在根据产品的需要和规划,要把前端项目打包后独立出来
API接口后端的独立域名 https://api.dodobook.net 前端Web端的域名独立如下 https://web.dodobook.net 现在需要在前端不项目去跨域请求API接口 直接访问的时候会出现大量的CORS相关的跨域报错例如 Access to XMLHttpRequest at 'http://www.dodobook.me/comm/test-ajax?hello=dodo' from origin 'http://www.dodobook.cc' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
试了好几种方式,改nginx,改代码等方式都未果,也可能是自己某些方面疏忽踩坑。
现在贴出来现在的处理方式.使用中间件。
新建一个中间件 php artisan make:middleware EnableCrossRequestMiddleware
书写中间件内容
namespace App\Http\Middleware;
use Closure;
class EnableCrossRequestMiddleware
{
/**
* Handle an incoming request.
*
* @param \Illuminate\Http\Request $request
* @param \Closure $next
* @return mixed
/
public function handle($request, Closure $next)
{
$origin = $request->server('HTTP_ORIGIN') ? $request->server('HTTP_ORIGIN') : '';
$allow_origin = [
'https://web.dodobook.net',
'https://web.abcd.com',
];
if (in_array($origin, $allow_origin)) {
// $response->header('Access-Control-Allow-Origin', '</em>');
header("Access-Control-Allow-Origin:{$origin}"); //https 不可以用*号通配符
header('Access-Control-Allow-Headers:Origin,Content-Type,Cookie,X-CSRF-TOKEN,Accept,Authorization,X-XSRF-TOKEN,lang,sign,dodo');
header('Access-Control-Expose-Headers:Authorization,authenticated');
header('Access-Control-Allow-Methods:GET,POST,PUT,OPTIONS,PATCH,DELETE,HEAD');
header('Access-Control-Allow-Credentials:true');
}
$response = $next($request); //这个是进程--在请求之前就加上
return $response;
}
}
<h1>然后在内核文件注册该中间件</h1> protected $middleware = [ // more App\Http\Middleware\EnableCrossRequestMiddleware::class, ]; 在 App\Http\Kernel 类的 $middleware 属性添加,这里注册的中间件属于全局中间件。 然后你就会发现前端页面已经可以发送跨域请求了。 会多出一次 method 为 options 的请求是正常的,因为浏览器要先判断该服务器是否允许该跨域请求。
参考文章:https://learnku.com/articles/6504/laravel-cross-domain-solution
相关阅读
- 通过Google API客户端访问Google Play帐户报告PHP库
- PHP执行文件的压缩和解压缩方法
- 消息中间件MQ与RabbitMQ面试题
- 如何搭建一个拖垮公司的技术架构?
- Yii2中ElasticSearch的使用示例
热门文章
- 通过Google API客户端访问Google Play帐户报告PHP库
- PHP执行文件的压缩和解压缩方法
- 消息中间件MQ与RabbitMQ面试题
- 如何搭建一个拖垮公司的技术架构?
- Yii2中ElasticSearch的使用示例
最新文章
- 通过Google API客户端访问Google Play帐户报告PHP库
- PHP执行文件的压缩和解压缩方法
- 消息中间件MQ与RabbitMQ面试题
- 如何搭建一个拖垮公司的技术架构?
- Yii2中ElasticSearch的使用示例

