相关疑难解决方法(0)

当我导出为生产时，我不明白这些错误npm run build，但当我测试时npm run dev它工作得很好。我使用API 路由getStaticProps并从中获取。getStaticPath

首先当我npm run build

FetchError: invalid json response body at https://main-website-next.vercel.app/api/products reason: Unexpected token T in JSON at position
0
    at D:\zummon\Main Website\main-website-next\node_modules\node-fetch\lib\index.js:272:32
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async getStaticPaths (D:\zummon\Main Website\main-website-next\.next\server\pages\product\[slug].js:1324:18)
    at async buildStaticPaths (D:\zummon\Main Website\main-website-next\node_modules\next\dist\build\utils.js:16:80)
    at async D:\zummon\Main Website\main-website-next\node_modules\next\dist\build\utils.js:26:612
    at async D:\zummon\Main Website\main-website-next\node_modules\next\dist\build\tracer.js:1:1441 {
  type: 'invalid-json'
}

\pages\product\[slug]

import { assetPrefix } from '../../next.config'

export default function Page(){...}

export const getStaticProps = async ({ params: { …

我正在使用 Next.js 构建一个应用程序，我需要连接到特定的 API 路由（使用API Platform设置）并使用路由的响应填充页面。

该API工作正常，但无论我如何努力实现内部的我爱可信电话getServerSideProps，我总是得到同样的错误，ECONNREFUSED从我的节点栈。

我试图从中获取数据useEffect()并且它工作正常，但我想知道是否有办法直接在getServerSideProps.

我正在为 Docker 使用 Node 容器，并且路由通过 JWT 令牌（存储在会话和服务器端连接的客户端 cookie 中）进行身份验证

这是我的代码：

pages/accounts.js：

export async function getServerSideProps(context) {
  const cookies = new Cookies(context.req.headers.cookie)
  const adminToken = cookies.get('jwtToken')

  const res = await getAllAccounts(adminToken)

  return {
    props: {
      testdata: ''
    },
  }
}

lib/accounts.js：

import service from '../service'

export const getAllAccounts = async (adminToken) => {
  const res = service({ jwtToken : adminToken }).get(`/accounts`).then((response) …

所以基本上我使用 getServerSideProps 来调用一些 API。当我在 getServerSideProps() 中调用 getSession 时，我得到一个有效的对象。

export async function getServerSideProps({ req }) {
   const session = await getSession({ req }); // works

但是当我在 getServerSideProps() 函数中调用的 API 中调用它时，我得到 null。

import { getSession } from "next-auth/react";

export default async (req, res) => {
  const { db } = await connectToDatabase();

  const session = await getSession({ req }); // returns null

这是 NextAuth 文档供参考：

我想fetch在相对路径上使用该方法，例如：

export async function getServerSideProps() {
    // Fetch data from local API
    const res = await fetch(`/api/get_all_prices`)
    const data = await res.json()
    // Pass data to the page via props
    return { props: { data } }
}

function HomePage({props}) {
    return (
        // use props here
    )
}

原因如下：我正在多台不同的计算机上测试我的代码，有时使用不同的端口

我希望这段代码能够在开发和生产环境中工作，以便必须记住在每台计算机/服务器的基础上更改使用的网址（女巫引入了许多不需要的潜在问题）

如何从本地 api 路由获取数据？

我无法弄清楚为什么该fetch方法不执行本地路由或​​解决方法。

[编辑]

解决方案是一个名为 superjson 的库。

我试图将我的代码放入 API 中，因为我无法将 getServerSideProps 与 prisma 一起正确使用（它返回无法在 JSON 中序列化的 Date 对象）

因此，我尝试使用 API 路径作为正确序列化的响应，但遇到了让我写这个问题的问题

完整的解决方案是将方法写入公共文件中（这允许分解），使用 lib superjson …

我使用 Auth0 来验证用户身份。

我受保护的 api 路由如下：

// pages/api/secret.js

import { withApiAuthRequired, getSession } from '@auth0/nextjs-auth0';

export default withApiAuthRequired(function ProtectedRoute(req, res) {
  const session = getSession(req, res);
  const data = { test: 'test' };
  res.json({ data });
});

我的问题是，当我尝试从 getServerSideProps 获取数据时，我收到 401 错误代码。

如果我使用 useEffect 我可以从 api 路由获取数据。

我试图像这样获取数据：

export const getServerSideProps = withPageAuthRequired({
  async getServerSideProps(ctx) {
    const res = await fetch('http://localhost:3000/api/secret');
    const data = await res.json();

    return { props: { data } };
  },
});

我收到以下响应：错误：“not_authenticated”，描述：“用户没有活动会话或未经过身份验证”

大家有什么想法吗？谢谢！！