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:提供了更简单的跨域配置方式。

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

相关推荐
乘云数字DATABUFF3 天前
5分钟部署开源APM Databuff:OpenTelemetry全链路追踪入门实战
运维·后端
荣--5 天前
一键部署不是为了省时间 —— 它是把"买来的 PaaS"变成"自己的平台"的拐点
运维·zabbix·工程化·一键部署·平台化·边界设计
江华森5 天前
动手实战学 Docker — 从零到集群编排完全指南
运维
Avan_菜菜5 天前
FRP 内网穿透完整实战:从 HTTP 映射到 HTTPS 自签代理
运维·nginx·https
SelectDB6 天前
Litefuse 开源并推出单进程轻量模式,25 秒就能跑起来的 Agent 可观测与评估平台
运维·后端·自动化运维
XIAOHEZIcode8 天前
Linux系统鼠标偏移常见原因以及修复方案
linux·运维·游戏
用户0328472220708 天前
如何搭建本地yum源(上)
运维
ping某10 天前
为什么 Nginx 明明监听了 80,转发后端时却用了 4xxxx 端口?
后端·nginx
大树8811 天前
金刚石散热越强,管路越先见顶
大数据·运维·服务器·人工智能·ai
摇滚侠11 天前
Linux CentOS7 rpm 安装 MySQL 5.7
linux·运维·mysql