thinnkphp5.1和 thinkphp6以及nginx,apache 解决跨域问题

ThinkPHP 5.1

  1. 使用中间件设置响应头
    ThinkPHP 5.1 及以上版本支持中间件,可以通过中间件统一设置跨域响应头。

步骤:

创建一个中间件文件,例如 CorsMiddleware.php:

php 复制代码
namespace app\middleware;

class CorsMiddleware
{
    public function handle($request, \Closure $next)
    {
        $response = $next($request);

        // 设置跨域响应头
        $response->header([
            'Access-Control-Allow-Origin' => '*', // 允许所有域名访问
            'Access-Control-Allow-Methods' => 'GET, POST, PUT, DELETE, OPTIONS', // 允许的请求方法
            'Access-Control-Allow-Headers' => 'Content-Type, Authorization, X-Requested-With', // 允许的请求头
        ]);

        return $response;
    }
}

在 app/middleware.php 中注册中间件:

php 复制代码
return [
    // 其他中间件
    \app\middleware\CorsMiddleware::class,
];

如果需要针对特定路由启用跨域,可以在路由中单独应用中间件:

php 复制代码
Route::group(function () {
    // 你的路由
})->middleware(\app\middleware\CorsMiddleware::class);
  1. 在控制器中设置响应头
    如果不需要全局设置跨域,可以在控制器中手动设置响应头。

示例:

php 复制代码
namespace app\controller;

use think\Response;

class Index
{
    public function index()
    {
        // 设置跨域响应头
        $response = Response::create('Hello, World!', 'json');
        $response->header([
            'Access-Control-Allow-Origin' => '*',
            'Access-Control-Allow-Methods' => 'GET, POST, PUT, DELETE, OPTIONS',
            'Access-Control-Allow-Headers' => 'Content-Type, Authorization, X-Requested-With',
        ]);

        return $response;
    }
}
  1. 处理 OPTIONS 预检请求
    浏览器在发送跨域请求时,会先发送一个 OPTIONS 请求(预检请求),服务器需要正确处理该请求。

示例:

在路由中定义一个 OPTIONS 请求的路由:

php 复制代码
Route::options('*', function () {
    return Response::create()->code(204)->header([
        'Access-Control-Allow-Origin' => '*',
        'Access-Control-Allow-Methods' => 'GET, POST, PUT, DELETE, OPTIONS',
        'Access-Control-Allow-Headers' => 'Content-Type, Authorization, X-Requested-With',
    ]);
});

ThinkPHP 6 的跨域配置

ThinkPHP 6 提供了更简单的跨域配置方式,可以在 config/cors.php 中配置跨域。

步骤:

创建 config/cors.php 文件:

php 复制代码
return [
    'allow_origin' => ['*'], // 允许的域名
    'allow_methods' => ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'], // 允许的请求方法
    'allow_headers' => ['Content-Type', 'Authorization', 'X-Requested-With'], // 允许的请求头
    'expose_headers' => [], // 暴露的响应头
    'max_age' => 0, // 预检请求缓存时间
    'supports_credentials' => false, // 是否允许携带凭证
];

在 app/middleware.php 中启用跨域中间件:

php 复制代码
return [
    // 其他中间件
    \think\middleware\AllowCrossDomain::class,
];

Nginx设置跨域

如果不想在代码中处理跨域,可以在 Web 服务器(如 Nginx 或 Apache)中配置跨域。

Nginx 配置:

php 复制代码
server {
    location / {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization, X-Requested-With';

        if ($request_method = 'OPTIONS') {
            return 204;
        }
    }
}

Apache 设置跨域:

php 复制代码
<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
    Header set Access-Control-Allow-Headers "Content-Type, Authorization, X-Requested-With"
</IfModule>

RewriteEngine On
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=204,L]

总结

中间件:推荐使用中间件统一处理跨域。

控制器:如果仅需局部跨域,可以在控制器中设置响应头。

OPTIONS 请求:确保正确处理预检请求。

服务器配置:可以通过 Nginx 或 Apache 配置跨域。

ThinkPHP 6:提供了更简单的跨域配置方式。

根据项目需求选择合适的方式即可!

相关推荐
Starry-sky(jing)几秒前
crane 下载镜像:不连接 Docker,3 步准备并校验 ARM64 离线包
运维·docker·arm64·crane
古法老登瞎折腾12 分钟前
大数据智能运维实战(八):从调度任务追到计算引擎——补齐排查链路
java·大数据·运维·spring ai·mcp
zhongben123_14 分钟前
从0到1开发一款生鲜配送APP:核心技术难点与架构避坑指南
大数据·运维·人工智能·ios·架构·web app
学页官方36 分钟前
部署实战】教培系统私有化部署全流程:从云服务器到上线验收
运维·服务器
时间售卖铺42 分钟前
MySQL 备份
运维·数据库·mysql·云原生
指艺1 小时前
VirtualBox安装fedora完成后重启,仍提示安装fedora
运维·服务器
4SAPI1 小时前
电商全链路内容自动化生成大模型 API 生产选型指南:4SAPI、硅基流动与 OpenRouter 的架构权衡
运维·人工智能·架构·自动化·1024程序员节
Leo.yuan2 小时前
数据准备工具进入自动化时代:7款产品的实际使用场景与选择建议
运维·自动化
吴建旭 智宅焕2 小时前
智能家居全国交付模式选型架构设计:连接型与兜底型的决策矩阵与匹配逻辑
运维·智能家居·devops
庵中十三居士2 小时前
用nginx代理DeepSeekHarness挂在域名下特定路径提供访问
运维·nginx·deepseek·harness