Docker环境下NextJs无法从Laravel API获取数据求助

技术栈 #

• Laravel
• Next.js
• Docker

问题描述 #

使用上述技术栈开发时，在浏览器和Postman中访问http://localhost:5001/api/surfaces均可正常获取数据，但在Next.js的pages/surfaces.js文件的getServerSideProps方法中发起请求时出现失败，错误截图显示请求失败，终端日志也存在异常信息。

相关代码 #

Next.js页面代码（pages/surfaces.js） #

import AdminLayout from "../../modules/admin/layout/AdminLayout";
import Table from "../../sharedComponents/Table";
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
import { useTranslation } from "next-i18next";
import { ContentHeader } from "../../modules/admin/SharedComponents/ContentHeader/ContentHeader";
import { ConfigDataTable } from "../../modules/admin/Surfaces/ConfigDataTable";

export default function Surfaces() {
  const { t } = useTranslation("common");
  
  return (
    <>
      <ContentHeader title={t('surfaces')} isCRUD={false} />
      <Table config={ConfigDataTable()} data={[]} />
    </>
  );
}

Surfaces.getLayout = function getLayout(page) {
  return <AdminLayout>{page}</AdminLayout>;
};

export async function getServerSideProps({locale}) {
  const response = await fetch('http://localhost:5001/api/surfaces/');

  console.log('ggg ',  await response.json());


  return {
    props: {
      ...(await serverSideTranslations(locale))
    }
  }
}

Nginx配置 #

server {
    listen  80;

    index index.php index.html index.htm;
    root /var/www/public;

    server_name  finaldraw.local;

    location / {
        try_files $uri $uri/ /index.php?q=$uri&$args;
    }

    location ~ ^/.+\.php(/|$) {
        fastcgi_pass nadal:9000;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }
}

Laravel CORS中间件代码 #

public function handle($request, Closure $next): mixed
{
    return $next($request)
        ->header('Access-Control-Allow-Origin', '*')
        ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers',' Origin, Content-Type, Accept, Authorization, X-Request-With, lang')
        ->header('Access-Control-Allow-Credentials',' true');
}

补充信息 #

请求URI：http://localhost:5001/api/surfaces

内容的提问来源于stack exchange，提问作者Juan Pablo B