利用ThinkPHP中间件解决跨域请求的问题

最近写接口,遇到跨域的问题,折腾半天算是基本解决了,记录一下

跨域的问题好早就接触过,当时使用的jQuery,利用jsonp进行跨域请求,但是jsonp只支持get请求,这就有很大限制,导致没有办法接收其他类型的请求

因为这一次做的是前后端分离的项目,所有请求都是跨域,所以就想从后端解决跨域的问题


一、关于跨域请求


我们先来分析一下问题,这一次前端用的是Vue,当进行跨域的时候会先发起一个options请求,然后根据options请求获得的响应来确认是否能够执行实际的请求

关于options请求:为什么会有OPTIONS请求

根据后端跨域的解决方案我们是要给出包括 Access-Control-Allow-OriginAccess-Control-Allow-HeadersAccess-Control-Allow-Methods 等的响应来确认实际请求可通过的来源、实际请求方法等

以上是关于跨域本次跨域请求的一个分析,更多的关于跨域请求的详细内容可以阅读以下内容:


二、实现解决方案


知道了跨域请求的解决方案,那么如何在框架中更好地使用呢?

接下来我们就来实践一下,如何在ThinkPHP框架中比较优雅地解决跨域问题

本人用的TP5.1,在TP中能够对http请求进行操作的结构,是中间件,主要用于拦截或过滤应用的HTTP请求,并进行必要的业务处理,那我们就在这进行对于请求处理

首先,我们需要来创建中间件

在我的项目中application/http/middleware下新建文件CheckOptions.php,

<?php
namespace app\http\middleware;

use think\Response;

class CheckOptions
{
    public function handle($request, \Closure $next)
    {
        
    }
}

然后在我的当前模块目录下新建middleware.php来注册中间件

<?php
return [
    app\http\middleware\CheckOptions::class,
];

这样,CheckOptions中间件就只在当前模块下起作用

接着我们来通过中间件对请求进行操作

我们的中间件主要是针对options请求进行处理,所以使用前置的的方式

先判断是否是options请求,如果是,那么,返回一个Response对象实例,其中包含 Access-Control-Allow-OriginAccess-Control-Allow-Methods 等header信息

如果不是,就带着请求头继续执行后续请求

<?php
namespace app\http\middleware;

use think\Response;
use think\Request;

class Checkoption
{
    /**
     * @param  Request  $request
     * @param \Closure $next
     *
     * @return Response
     */
    public function handle($request, \Closure $next)
    {
        if ($request->isOptions()) {
            return Response::create()->header('Access-Control-Allow-Origin', '*')
                ->header('Access-Control-Allow-Methods', 'GET, POST, PATCH, PUT, DELETE')
                ->header('Access-Control-Allow-Headers', 'Authorization, Origin, X-Requested-With, Content-Type, Accept')
                ->header('Content-type', 'application/json');
        }

        $res = $next($request);
        return $res->header('Access-Control-Allow-Origin', '*')
            ->header('Access-Control-Allow-Methods', 'GET, POST, PATCH, PUT, DELETE')
            ->header('Access-Control-Allow-Headers', 'Authorization, Origin, X-Requested-With, Content-Type, Accept');
    }
}

这样,利用tp中间件解决跨域请求的问题就算实现了

中间件的使用场景和使用方法好有很多,比如使用前置中间件进行判断登录状态、访问权限控制等操作,时候后置中间件进行日志操作、请求分析等,使用方法还可以在路由或者控制器中使用,这一次的token验证也是在中间件中进行的

了解了中间件能做什么,之后需要的时候自然就会想起来

飞行猿博客
请先登录后发表评论
  • 最新评论
  • 总共0条评论