Axios无法向Laravel控制器发送表单数据，线上服务器无响应

我有一个基于Laravel后端、Vue3前端的项目，使用Box Spout包将xlsx文件上传至MySQL数据库。本地环境下一切运行正常，但部署到线上服务器后，Axios似乎完全没有触发控制器，无任何响应。

控制器代码（PHP） #

function importData(Request $request){

    $this->validate($request, [
        'file' => 'required|file|mimes:xls,xlsx'
    ]);
    $the_file = $request->file('file');
    try{

        ini_set('max_execution_time', 0);

        $the_file = $request->file('file');

        $reader = ReaderEntityFactory::createXLSXReader();
        $reader->open($the_file);

        $data = array();
        foreach ($reader->getSheetIterator() as $sheet) {
            foreach ($sheet->getRowIterator() as $row) {
                // do stuff with the row
                $cells = $row->getCells();
                $data[] = [
                    'pr_number' => $cells[0],
                    'state' => 0,
                    'user_id' => auth()->id(),
                    'created_at' => Carbon::now(),
                ];
            }
        }

        $reader->close();
        $limit = 65000; // Mysql placeholder limit ...

        foreach (array_chunk($data,1000) as $chunk) {
            Prs::insert($chunk);
        }

    } catch (Exception $e) {
        $error_code = $e->errorInfo[1];
        return back()->withErrors('حدث خطأ أثناء عملية التحميل!');
    }
    return back()->withSuccess('تم تحميل البيانات بنجاح.');
}

Axios请求代码（JavaScript） #

const importData = async fileName => {
    const config = {
        headers: {
            'Authorization': 'Bearer ...', 
            'Content-Type': 'multipart/form-data',
        },
        onUploadProgress: progressEvent => {
            let percentCompleted = Math.floor((progressEvent.loaded * 100) / progressEvent.total)
            console.log(progressEvent.total)

            // do whatever you like with the percentage complete
            // maybe dispatch an action that will update a progress bar or something
        },
    }

    let data = new FormData()
    data.append("file", fileName)
 
    await axios
        .post("/api/importData/", data, {
            headers: {
                'Content-Type': 'multipart/form-data',
            },
        }) 
        .then(response => {
            router.push({ name: 'prs' })
            swal({
                toast: true,
                position: 'top-end',
                showConfirmButton: false,
                timer: 3000,
                timerProgressBar: true,
                icon: "success",
                title: "[ PR ] has been [IMPORTED] successfully  ",
            })
        })
        .catch(function (err) {
            swal({
                toast: true,
                position: 'top-end',
                showConfirmButton: false,
                timer: 3000,
                timerProgressBar: true,
                icon: "error",
                title: err,
            })
        })
}

排查与解决建议 #

• 核对请求路由与URL
  检查线上环境的API路径是否正确，比如本地的/api/importData/是否因为服务器域名、子目录配置导致404。打开浏览器开发者工具的Network面板，查看请求的状态码和响应内容，确认请求是否能到达后端。
• 修复Token与权限问题
  代码中Authorization的Token是硬编码的，线上环境需确保使用的是有效且有权限的用户Token，同时检查Laravel的API认证中间件（如auth:sanctum）配置是否正确。
• 调整服务器文件上传限制
  线上PHP配置可能限制了文件大小和执行时间：
  • 修改php.ini中的upload_max_filesize、post_max_size为合适的值（比如20M以上）
  • 全局设置max_execution_time，或在控制器中用set_time_limit(0);替代ini_set，避免被服务器配置覆盖
• 排查跨域问题
  检查浏览器控制台是否有CORS报错，确保服务器（Nginx/Apache）和Laravel的CORS配置正确，允许前端域名的跨域请求。
• 查看Laravel日志
  打开storage/logs/laravel.log，里面会记录请求是否到达、是否有报错（比如文件权限、数据库连接、Box Spout依赖问题），这是排查线上问题的关键。
• 修正FormData的Content-Type设置
  无需手动设置multipart/form-data，浏览器会自动添加正确的边界标识，建议移除Axios请求中手动设置的headers，让Axios自动处理：

  await axios.post("/api/importData/", data)
  

• 检查服务器目录权限
  确保Laravel的storage、bootstrap/cache目录对服务器运行用户（如www-data）有写入权限，否则文件上传后无法读取，导致流程中断。

内容的提问来源于stack exchange，提问作者Mohammed khuDari