yii2-搭建Swagger：增加接口名/作者搜索，接口跨域处理方案（二）

最新推荐文章于 2026-03-31 11:00:13 发布

原创最新推荐文章于 2026-03-31 11:00:13 发布 · 2.3k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

PHP 专栏收录该内容

39 篇文章

订阅专栏

本文介绍了在Yii2项目中如何利用Swagger实现接口名称和作者的搜索功能，以方便开发者快速定位接口。同时，文章提出了一个解决接口跨域问题的方案，通过在控制器中设置适当的方法来处理跨域请求。详细步骤和代码资源已提供，包括Git仓库链接和CSDN下载地址。

一. 运用背景

生成的在线接少与前端人员/app开发人员的口文档确实减沟通成本，但是由于项目比较庞大，一个项目的接口由N多人同时开发，并且有成千上万个接口，这时候就出现了一个问题：当后端开发人员想去查看自己的开发的接口，或者是某个接口，就变得很头疼，只能手动去寻找。萌生了把Swagger顶部的搜索改成更契合需求的

① 接口名称查询

② 开发作者查询

二. 解决思路/方案

去掉顶部搜索“explore”按钮事件==>>绑定新的“搜索”按钮事件==>>用户点击“搜索”前确保所有接口正常（避免二次搜索问题）==>>通过自带的search函数搜索标题含有的字符串==>>通过操作dom对象隐藏节点

代码源文件我直接放Git上，写的有点粗糙，可以优化整理下，地址（https://github.com/WatermelonMk/swaggerSearch）

或者CSDN下载资源：https://download.csdn.net/download/watermelonmk/11004522

只要替换掉dist目录下(别弄错了)：index.html 和 swagger-ui-standalone-preset.js

效果图（左原图，右搜索后效果图）：

三. 跨域问题解决方案

建议在每个模块的控制层先不要继承ActiveController,可以在中间先继承CommonController(看自己命名了)，然后再继承ActiveController，然后再把这个加进去。然后在每个模块的控制层用ArrayHelper::merge方法拼接上这个。

public function behaviors() { 
    $behaviors['corsFilter'] = [
            'class' => 'yii\filters\Cors',
            'cors' => [
                'Origin' => '*',
                'Access-Control-Request-Method' => ['GET', 'POST', 'PUT', 'PATCH', 'DELETE', 'HEAD', 'OPTIONS'],
                'Access-Control-Request-Headers' => ['*'],
                'Access-Control-Allow-Credentials' => true,
            ],
     ];
}