postgresql 在vercel中构建时发生部署错误,语法错误:JSON中位置0处的意外标记T

avwztpqn  于 2023-02-12  发布在  PostgreSQL
关注(0)|答案(1)|浏览(118)

嗨,我是编码新手,并尝试使待办事项应用程序。
但在vercel中构建时遇到错误。
它在开发环境中运行良好。
使用Next13、typscript、prisma、PostgreSQL、铁路、顺风
错误码

SyntaxError: Unexpected token T in JSON at position 0
    at JSON.parse (<anonymous>)
    at Response.json (node:internal/deps/undici/undici:6160:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Home (/vercel/path0/.next/server/app/page.js:478:18)
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
SyntaxError: Unexpected token T in JSON at position 0
    at JSON.parse (<anonymous>)
    at Response.json (node:internal/deps/undici/undici:6160:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Home (/vercel/path0/.next/server/app/page.js:478:18)
info  - Generating static pages (3/3)
> Build error occurred
Error: Export encountered errors on following paths:
    /page: /
    at /vercel/path0/node_modules/next/dist/export/index.js:415:19
    at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
    at async /vercel/path0/node_modules/next/dist/build/index.js:1400:21
    at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
    at async /vercel/path0/node_modules/next/dist/build/index.js:1259:17
    at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
    at async Object.build [as default] (/vercel/path0/node_modules/next/dist/build/index.js:66:29)
Error: Command "npm run build" exited with 1

page.tsx

import PostForm from "../components/PostForm";
import Tasks from "../components/Tasks";

async function getPosts() {
  const res = await fetch(`${process.env.BASE_URL}/api/getPosts`);
  if (!res.ok) {
    console.log(res);
  }
  return res.json();
}

export default async function Home() {

  const data: {
    id: number;
    title: string;
    content: string;
    timestamp: string;
  }[] = await getPosts();

  return (
    <div>
      <PostForm />
      <div className="sm:flex  sm:justify-center sm:items-baseline sm:flex-wrap max-w-7xl mx-auto mt-7">
        {data.reverse().map((post) => (
          <Tasks
            title={post.title}
            content={post.content}
            id={post.id}
            timestamp={post.timestamp}
          />
        ))}{" "}
      </div>
    </div>
  );
}

程序包-json

{
  "name": "testapp-next13-tailwind-prisma-postgresql-typescript",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@next/font": "13.1.6",
    "@prisma/client": "^4.9.0",
    "@types/react": "18.0.27",
    "@types/react-dom": "18.0.10",
    "next": "13.1.6",
    "react": "18.2.0",
    "react-dom": "18.2.0"
  },
  "devDependencies": {
    "@types/node": "^18.11.19",
    "autoprefixer": "^10.4.13",
    "postcss": "^8.4.21",
    "prisma": "^4.9.0",
    "tailwindcss": "^3.2.4",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.5"
  }
}

您可以在此处看到存储库https://github.com/satoshi02198/Task-maker
我很感激你的帮助。先谢了。
将page.tsx中的代码更改为客户端组件,使用useEffect获取数据,而不是服务器端呈现。(您可以在page.tsx的存储库中看到umcoment代码,但该代码也无法部署)我还检查了vercel BASE_URL中的环境变量设置,将其设置为https://task-maker-3.vercel.app(vercel尝试部署到的位置),并检查了PostgreSQL的DATABASE_URL
我编辑页面. tsx到这个语法错误似乎解决,但新的错误来了

async function getPosts() {
    const res = await fetch(`${process.env.BASE_URL}/api/getPosts`);
        if (!res.ok) {
            console.log(res.json());
        }
          return res.text();
        }

export default async function Home() {
    const data = await getPosts();

     const jsonData = JSON.parse(data);
     console.log(jsonData);

  return (
    <div>
      <PostForm />
  <div className="sm:flex  sm:justify-center sm:items-baseline sm:flex-wrap max-w-7xl mx-auto mt-7">
    {jsonData
      .reverse()
      .map(
        (post: {
          title: string;
          content: string;
          id: number;
          timestamp: string;
        }) => (
          <Tasks
            title={post.title}
            content={post.content}
            id={post.id}
            timestamp={post.timestamp}
          />
        )
      )}{" "}
  </div>
</div>
);
}

和Vercel新错误

TypeError: The body has already been consumed.
at consumeBody (node:internal/deps/undici/undici:6072:19)
at consumeBody.next (<anonymous>)
at Response.text (node:internal/deps/undici/undici:6146:28)
at getPosts (/vercel/path0/.next/server/app/page.js:457:16)
at process.processTicksAndRejections   ( 
 node:internal/process/task_queues:95:5)
at async Home (/vercel/path0/.next/server/app/page.js:460:18)
Error occurred prerendering page "/". Read more: 
https://nextjs.org/docs/messages/prerender-error
TypeError: The body has already been consumed.
at consumeBody (node:internal/deps/undici/undici:6072:19)
at consumeBody.next (<anonymous>)
at Response.text (node:internal/deps/undici/undici:6146:28)
at getPosts (/vercel/path0/.next/server/app/page.js:457:16)
at process.processTicksAndRejections 
(node:internal/process/task_queues:95:5)
at async Home (/vercel/path0/.next/server/app/page.js:460:18)
info  - Generating static pages (3/3)
> Build error occurred
 Error: Export encountered errors on following paths:
/page: /
at /vercel/path0/node_modules/next/dist/export/index.js:415:19
at process.processTicksAndRejections 
 (node:internal/process/task_queues:95:5)
at async Span.traceAsyncFn 
 (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async /vercel/path0/node_modules/next/dist/build/index.js:1400:21
at async Span.traceAsyncFn 
(/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async /vercel/path0/node_modules/next/dist/build/index.js:1259:17
at async Span.traceAsyncFn 
(/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async Object.build [as default] 
(/vercel/path0/node_modules/next/dist/build/index.js:66:29)
Error: Command "npm run build" exited with 1
8yparm6h

8yparm6h1#

这是因为fetch返回的数据或错误不是有效的JSON对象。
因此,代替:

res.json()

执行:

res.text()

然后,您可以在执行错误检查之后执行JSON.parse。

相关问题