我尝试复制/粘贴 NextJS 的官方示例，但getServerSideProps它抛出错误：

import type { InferGetServerSidePropsType, GetServerSideProps } from 'next'
 
type Repo = {
  name: string
  stargazers_count: number
}
 
export const getServerSideProps: GetServerSideProps<{
  repo: Repo
}> = async () => {
  const res = await fetch('https://api.github.com/repos/vercel/next.js')
  const repo = await res.json()
  return { props: { repo } }
}
 
export default function Page({
  repo,
}: InferGetServerSidePropsType<typeof getServerSideProps>) {
  return repo.stargazers_count
}

错误：

./app/page.tsx
ReactServerComponentsError:

"getServerSideProps" is not supported in app/. Read more: https://nextjs.org/docs/app/building-your-application/data-fetching

不幸的是，它引用了数据获取文档，其中包含导致我出现此错误的示例。

重现步骤：

1. 创建应用程序：

   npx …

我正在遵循使用旧版本 Next.js 的在线教程。我现在使用 Next.js 13，并尝试实现 GetStaticProp() 从我的 api 获取数据，但无法在 app 文件夹下使用该函数。

我现在正在尝试按照 Next.js 的建议实现数据获取（https://beta.nextjs.org/docs/data-fetching/fetching）。我收到的错误是：

未处理的运行时错误错误：无法读取未定义的属性（读取“切片”）

我的代码是：

import Layout from "components/Layout.js";
import ResourceHighlight from "components/ResourceHighlight.js";
import ResourceList from "components/ResourceList.js";
import Newsletter from "components/Newsletter.js";
import Footer from "components/Footer.js";


function Home({resources}) {
  return ( 
    <Layout> 
     <ResourceHighlight
        resources={resources.slice(0,2)}
      />
      <ResourceList
        resources={resources.slice(2)}
      />
       <Newsletter /> 
      <Footer />
    </Layout>
  )
}

export async function getData(){ 
  const resData = await fetch('http://localhost:3000/api/resources"'); 
  const data = await resData.json(); 

  //return resData.json(); 

  return { 
    props: { 
      resources: data
    } …

我尝试接触 Next.js 13（使用 App Router）并遇到了一些问题。我的测试应用程序的结构是：

---/school
------/app
   ------/layout.tsx
   ------/page.tsx
---/src

./app/page.tsx是​

async function Page() {

    const hotels = await hotelService.getAllHotels()

    return (
        <RootLayout>
            <HomePage hotels={hotels}/>
        </RootLayout>
    )
}

export default Page

当下一个构建进行收集页面数据步骤时， hotelService.getAllHotels()通过 URL 地址从 API 请求数据。URL 地址由$API_BACKEND_ENV变量定义，并取决于环境（URL_FRO_DEV=https://1.1.1.1/hotel/all 和 URL_FRO_PROD=https://2.2.2.2/hotel/all）。

该错误来自const res = wait fetch(this.url + "/hotel/all", { cache: 'no-store' })行。如果this.url未定义，则会引发错误。

如何避免收集页面数据并抛出异常？

NEXT JS文档表示getServerSideProps ()不会在下一个构建命令中启动。我尝试在getServerSideProps()内定义hotelService.getAllHotels ()并期望不请求 API。但这不起作用。

async function …