Question

我使用 NextJS 制作了一个网站并将其部署在 Vercel 上。

来自网址：https://etiselektrik.vercel.app/teknikbilgi/ 如果我点击第一篇文章。页面加载没有任何问题。但是，如果我直接输入带有 slug 页面的 url：https://etiselektrik.vercel.app/teknikbilgi/reaktifenerji-reaktifceza 我会收到 500 内部服务器错误。

我的生产版本中没有这个错误。

这是我的 slug 页面代码：

import ReactHtmlParser from 'react-html-parser';
import Layout from '../../components/Layout';
import { API_URL } from '../../config/index';

export default function BlogPost({ post }) {
return (
    <Layout
      title={post.title}
      description={post.metaDescription}
      keywords={post.metaKeywords}
    >
      <h1 className='px-4 py-4 md: my-4 simpleContainer font-semibold text-2xl text-secondary text-left'>
        {post.title}
      </h1>
      <div className='px-4 simpleContainer text-secondary'>
        {ReactHtmlParser(post.content)}
      </div>
    </Layout>
  );
}

export async function getServerSideProps({ query: { slug } }) {
  try {
    const res = await fetch(`${API_URL}/teknikbilgis/${slug}`);
    const post = await res.json();

    return {
      props: {
        post: post,
      },
    };
  } catch {
    return {
      props: {
        post: {},
      },
    };
  }
}

Answer 1

我发现了这个问题。在客户端，我使用 .replaceAll 函数在解析之前更改我的帖子。（我没有在我的代码中添加它们，因为我认为它无关紧要）

.replaceAll() 似乎在部署 nextjs 时出现问题。我把它改成了 .replace() 现在它可以工作了。

Next JS Slug Page 赢得了 vercel 部署的工作

1 个答案: