Laravel跨域文件上传与CORS配置完整指南【网络】

老宇君_8438

老宇君_8438

2026-08-08

281人浏览

原创

必须将handlecors中间件置于$middleware数组首项,配置cors.php的paths包含上传路径、allowed_origins明确指定域名且supports_credentials设为true,并在nginx中透传options请求并返回204响应。

laravel跨域文件上传与cors配置完整指南【网络】

前端通过 fetch 或 axios 向 Laravel 后端上传文件时被浏览器拦截,提示“Access to XMLHttpRequest at 'http://api.example.com/upload' from origin 'http://localhost:3000' has been blocked by CORS policy”,说明跨域策略未覆盖文件上传路径或凭证配置冲突,必须同步处理 OPTIONS 预检、响应头、Nginx 转发与 supports_credentials 四个关键层。

确认并启用 HandleCors 中间件

打开 app/Http/Kernel.php 文件,检查 $middleware 数组顶部是否已存在 \Fruitcake\Cors\HandleCors::class。若缺失或位于底部,Laravel 无法在请求生命周期早期拦截预检请求——此时即使 config/cors.php 写对了也完全不生效。

将该中间件【必须置于 $middleware 数组第一项】,不要放在 $middlewareGroups['api'] 里,因为文件上传接口常走 /upload 这类非 api/* 路径,而 $middlewareGroups['api'] 只作用于显式套了 middleware('api') 的路由。

执行 php artisan config:clear 清除配置缓存,避免旧配置残留干扰。

配置 cors.php 允许上传路径与凭证

运行 php artisan vendor:publish --tag="cors" 确保 config/cors.php 存在。编辑该文件,重点修改以下三项:

paths:必须包含文件上传路由路径,例如 ['api/*', 'upload', 'upload/*', 'sanctum/csrf-cookie']。只写 ['api/*'] 会导致 /upload 请求被直接拒绝。

allowed_origins:若前端携带 Cookie(如 Sanctum 登录态),【supports_credentials 必须为 true,且 allowed_origins 绝不能是 ['*']】。开发环境写成 ['http://localhost:3000', 'http://127.0.0.1:3000'];生产环境必须明确列出所有前端域名,如 ['https://app.example.com', 'https://admin.example.com']

supports_credentials:设为 true,否则浏览器不会发送 Cookie,后端无法校验登录态,文件上传接口会返回 401。

验证 Nginx 是否透传 OPTIONS 请求

浏览器上传文件前必发 OPTIONS 预检请求。若 Nginx 拦截并返回 405 或 404,Laravel 根本收不到该请求,HandleCors 中间件永不执行。

在 Nginx server 块中添加以下配置:

location / {

  # 允许跨域请求头

  add_header 'Access-Control-Allow-Origin' '$http_origin' always;

  add_header 'Access-Control-Allow-Credentials' 'true' always;

  add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;

Laravel
Laravel

避免常见的Laravel错误:N+1查询、批量赋值、缓存陷阱及队列序列化陷阱。

下载

  add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization' always;

  # 处理预检请求

  if ($request_method = 'OPTIONS') {

    add_header 'Access-Control-Max-Age' 17280000;

    add_header 'Content-Type' 'text/plain; charset=utf-8';

    add_header 'Content-Length' 0;

    return 204;

  }

}

重启 Nginx:sudo systemctl restart nginx。这一步不做,所有 PHP 层配置都白搭。

测试上传接口是否真正放行

第一步:用 curl 发送 OPTIONS 预检请求,验证响应头是否完整:

curl -X OPTIONS -H "Origin: http://localhost:3000" -H "Access-Control-Request-Method: POST" -I http://your-laravel-app.test/upload

观察返回头中是否有 Access-Control-Allow-Origin: http://localhost:3000Access-Control-Allow-Credentials: true

第二步:前端发起真实上传请求,fetch 配置必须带 credentials: 'include',否则 Cookie 不发出,后端无法识别用户身份。

第三步:检查 Laravel 日志 storage/logs/laravel.log,若看到 OPTIONS /upload 请求记录,说明 Nginx 已转发且中间件已执行;若无此记录,问题仍在 Nginx 层。

相关专题

更多
laravel组件介绍
laravel组件介绍

laravel 提供了丰富的组件,包括身份验证、模板引擎、缓存、命令行工具、数据库交互、对象关系映射器、事件处理、文件操作、电子邮件发送、队列管理和数据验证。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

2024.04.09

817

10

laravel中间件介绍
laravel中间件介绍

laravel 中间件分为五种类型:全局、路由、组、终止和自定。想了解更多laravel中间件的相关内容,可以阅读本专题下面的文章。

2024.04.09

795

9

laravel使用的设计模式有哪些
laravel使用的设计模式有哪些

laravel使用的设计模式有:1、单例模式;2、工厂方法模式;3、建造者模式;4、适配器模式;5、装饰器模式;6、策略模式;7、观察者模式。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

2024.04.09

2348

10

thinkphp和laravel哪个简单
thinkphp和laravel哪个简单

对于初学者来说,laravel 的入门门槛较低,更易上手,原因包括:1. 更简单的安装和配置;2. 丰富的文档和社区支持;3. 简洁易懂的语法和 api;4. 平缓的学习曲线。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.04.10

3261

7

laravel入门教程
laravel入门教程

本专题整合了laravel入门教程,想了解更多详细内容,请阅读专题下面的文章。

2025.08.05

4530

22

laravel实战教程
laravel实战教程

本专题整合了laravel实战教程,阅读专题下面的文章了解更多详细内容。

2025.08.05

3036

13

laravel面试题
laravel面试题

本专题整合了laravel面试题相关内容,阅读专题下面的文章了解更多详细内容。

2025.08.05

5829

7

PHP高性能API设计与Laravel服务架构实践
PHP高性能API设计与Laravel服务架构实践

本专题围绕 PHP 在现代 Web 后端开发中的高性能实践展开,重点讲解基于 Laravel 框架构建可扩展 API 服务的核心方法。内容涵盖路由与中间件机制、服务容器与依赖注入、接口版本管理、缓存策略设计以及队列异步处理方案。同时结合高并发场景,深入分析性能瓶颈定位与优化思路,帮助开发者构建稳定、高效、易维护的 PHP 后端服务体系。

2026.03.04

1336

29

Laravel 框架安装指南
Laravel 框架安装指南

本指南详解 Laravel 框架安装全流程,涵盖 PHP 8.1+ 环境配置、Composer 依赖管理工具安装及国内镜像源优化。重点演示使用 composer create-project 命令创建 Laravel 10/11 项目,解决常见安装错误与依赖冲突。从环境搭建到项目初始化,助您快速完成 Laravel 开发环境部署,为后续 Web 应用开发奠定基础。适合 PHP 初学者与框架迁移开发者参考。

2026.04.09

175

6

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
如何安装 Composer
如何安装 Composer

共1课时 | 179人学习

Composer手册
Composer手册

共0课时 | 0人学习