Question

我正在构建 Next.js 应用程序，我的主页是“混合”放大器页面

export const config = { amp: 'hybrid' };

export default function Home({ data }) {...}

export async function getStaticProps() {

  return {
    props: { data: {...} },
    revalidate: 6000,
  };
}

我正在使用 serverless

部署到 npx serverless

部署后，/index.html 主页在其 <head> 中包含对页面 amp 版本的引用，即 /index.amp

<link rel="amphtml" href="/index.amp">

当我进入放大器页面 /index.amp 时，我看到了 404 页面

哪位大侠知道是什么问题

"next": "11.0.0",
"react": "17.0.2",
"react-dom": "17.0.2",

Answer 1

不要直接访问 /index.amp，而是将 ?amp=1 添加到要加载页面的 AMP 版本的网址的末尾。

参考-https://nextjs.org/docs/api-reference/next/amp

编辑：

<块引用>

Ref- 目前我不知道任何 AMP 逻辑，因此应该不受支持。

经过大量调试后，我发现 AMP 中的混合方法不支持 serverless-next，尽管它在仅 AMP 的配置 export const config = { amp: true } 中运行良好。这就是为什么它可以在本地主机上运行而不是在部署上运行的原因。

您可以使用 nextjs server-side redirects 实现此行为。

从@19.0.0 版本开始，它不受官方支持。

我的 serverless.yml 文件

myApp:
  component: '@sls-next/serverless-component@1.19.0'

编辑 2：

当我没有指定版本时，它终于可以工作了。我更改的 serverless.yml 文件

myApp:
  component: '@sls-next/serverless-component'

我工作部署的无服务器放大器版本网址是 here

注意- 如果不指定版本，将使用latest标签，指的是最新的稳定版本here（即非alpha版本）。

Next js - AMP 混合页面返回 404

1 个答案:

编辑：

编辑 2：