TP6中间件跨域请求报错解决代码

浅宇吖_9331

浅宇吖_9331

2026-09-17

339人浏览

原创

tp6跨域报错主因是后端未在正确时机用正确方式设置cors响应头,需拦截options预检、动态匹配origin、操作response设头,并避免nginx/apache重复添加;推荐手写cors中间件。

tp6中间件跨域请求报错解决代码

TP6中间件跨域报错,核心不是前端发错了请求,而是后端没在正确时机、用正确方式把 CORS 响应头发出去。重点在于拦截 OPTIONS 预检、动态匹配 Origin、操作 Response 对象设头,且避开 Nginx/Apache 重复添加。

手写 Cors 中间件(推荐,兼容 TP6.0+)

新建 app/middleware/Cors.php,内容如下:


namespace app\middleware;

use think\Request;
use think\Response;

class Cors
{
  public function handle(Request $request, \Closure $next): Response
  {
    // 拦截并响应 OPTIONS 预检请求
    if ($request->isOptions()) {
      return response('', 204)
        ->header('Access-Control-Allow-Methods', 'GET,POST,PUT,DELETE,OPTIONS')
        ->header('Access-Control-Allow-Headers', 'Authorization,Content-Type,X-Requested-With,X-Token')
        ->header('Access-Control-Allow-Credentials', 'true');
    }

    $response = $next($request);

    // 动态读取 origin 并校验白名单
    $origin = $request->header('origin');
    $whitelist = config('cors.allow_origins', ['http://localhost:3000', 'https://admin.example.com']);

    if ($origin && in_array($origin, $whitelist)) {
      $response->header('Access-Control-Allow-Origin', $origin);
      $response->header('Access-Control-Allow-Credentials', 'true');
    }

    // 统一设置公共头
    $response->header([
      'Access-Control-Allow-Methods' => 'GET,POST,PUT,DELETE,OPTIONS',
      'Access-Control-Allow-Headers' => 'Authorization,Content-Type,X-Requested-With,X-Token',
    ]);

    return $response;
  }
}

注册中间件到全局首位

打开 app/middleware.php,确保 Cors 中间件排在数组最前面:

象寄翻译
象寄翻译

象寄翻译是一款AI视频创作工具,AI图片和视频翻译神器,支持多种语言的翻译。

下载


return [
  app\middleware\Cors::class, // 必须第一行
  // \think\middleware\SessionInit::class,
  // \think\middleware\Auth::class,
];

配置白名单(可选,更规范)

在 config/cors.php 中定义允许域名:


return [
  'allow_origins' => [
    'http://localhost:3000',
    'https://admin.example.com',
    'https://shop.example.com'
  ],
];

关键避坑点

  • 不要在中间件里写 header() 函数——TP6 响应走 PSR-7 对象,手动调用会被覆盖
  • 带 credentials: 'include' 时,Access-Control-Allow-Origin 不能是 *,必须动态匹配 origin
  • Nginx 或 Apache 若已加 CORS 头,请关闭,否则出现 "multiple values" 报错
  • OPTIONS 请求必须返回 204 状态码 + 空响应体,不能返回 200 或带 JSON
  • 前端发了 X-Token 或 Authorization,Access-Control-Allow-Headers 就必须显式包含它们

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
什么是中间件
什么是中间件

中间件是一种软件组件,充当不兼容组件之间的桥梁,提供额外服务,例如集成异构系统、提供常用服务、提高应用程序性能,以及简化应用程序开发。想了解更多中间件的相关内容,可以阅读本专题下面的文章。

2024.05.11

649

5

Golang 中间件开发与微服务架构
Golang 中间件开发与微服务架构

本专题系统讲解 Golang 在微服务架构中的中间件开发,包括日志处理、限流与熔断、认证与授权、服务监控、API 网关设计等常见中间件功能的实现。通过实战项目,帮助开发者理解如何使用 Go 编写高效、可扩展的中间件组件,并在微服务环境中进行灵活部署与管理。

2025.12.18

624

18

ThinkPHP中间件机制与请求拦截处理实践
ThinkPHP中间件机制与请求拦截处理实践

本专题围绕 ThinkPHP 中间件体系展开,深入讲解中间件的定义、注册与执行流程。内容包括全局中间件与路由中间件的区别、请求前后处理逻辑、自定义中间件开发以及权限验证与日志处理应用。通过实际案例,帮助开发者掌握中间件在项目中的核心作用与最佳实践。

2026.03.31

438

17

OpenJDK JVM参数怎么调优
OpenJDK JVM参数怎么调优

Java应用运行缓慢,如何调整JVM参数?本专题介绍OpenJDK JVM性能调优的基本流程,涵盖性能指标确认、运行数据采集、内存配置和垃圾回收分析,帮助你先定位瓶颈,再通过对照测试验证效果,避免直接套用参数而影响应用稳定性。

2026.10.16

100

10

OpenJDK怎么配置Java开发环境
OpenJDK怎么配置Java开发环境

怎样用OpenJDK搭建开发环境?本专题介绍版本选择、下载安装、环境变量配置和编译运行验证,帮助你理清JDK的作用及基本配置流程,并通过简单程序检查环境是否可用,为后续项目开发做好准备。

2026.10.16

60

10

OpenJDK怎么部署Java应用
OpenJDK怎么部署Java应用

Java项目开发完成后,怎样部署到目标环境并正常运行?本专题介绍OpenJDK应用部署流程,涵盖运行环境准备、版本兼容检查、应用打包、启动参数配置和日志查看,帮助你理清部署前后的操作顺序,减少环境差异造成的运行问题。

2026.10.16

40

10

Revel框架模板渲染与表单验证
Revel框架模板渲染与表单验证

本专题围绕Revel框架视图层开发,介绍模板语法、变量输出、布局复用、表单提交、参数绑定与验证规则,帮助开发者完成安全规范的页面交互。

2026.10.16

40

15

Revel框架MVC路由与控制器
Revel框架MVC路由与控制器

本专题聚焦Revel框架MVC核心机制,讲解路由定义、控制器Action、参数绑定、请求响应和反向路由,并结合常见场景梳理接口请求处理流程。

2026.10.16

20

15

Revel框架入门与安装配置
Revel框架入门与安装配置

本专题从Revel框架环境搭建讲起,系统介绍命令行工具安装、项目创建、目录结构、配置文件及热代码重载,帮助开发者快速完成首个Go Web应用。

2026.10.16

40

15

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
热门推荐
/
最新课程
phpStudy极速入门视频教程
phpStudy极速入门视频教程

共6课时 | 54.7万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时 | 133.9万人学习