如何修复“未捕获（承诺）SyntaxError：JSON 输入意外结束”？答案

【问题标题】：How to fix "Uncaught (in promise) SyntaxError: Unexpected end of JSON input"?如何修复“未捕获（承诺）SyntaxError：JSON 输入意外结束”？
【发布时间】：2021-06-16 20:42:34
【问题描述】：

当我尝试从 localhost 登录我的网站时，它工作得很好。但是，当我尝试从生产版本中执行相同操作时，它不起作用。我想我知道为什么，但我不知道如何解决它。当我尝试从 prod 构建（托管在 Vercel 上）登录时，它不会发布到 https://fs-dev.vercel.app/api/auth/login，而是发布到 https://fs-dev.vercel.app/undefined/api/auth/login。我不知道为什么它会在 prod 构建中添加和 /undefined/。（我正在使用 Next.js 和他们的 API 路由）。我已经检查过，baseUrl 是正确的，因为 prod 构建能够获取数据但不能 POST 数据。

这是我的post reqs代码：

fetchData.js

export const postData = async (url, post, token) => {
  const res = await fetch(`${baseUrl}/api/${url}`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': token
    },
    body: JSON.stringify(post)
  })
  const data = await res.json()
  return data
}

signin.js

const res = await postData('auth/login', userData);

【问题讨论】：

看起来baseUrl 未定义。添加console.log(baseUrl); 或使用您的调试器进行验证。

标签： javascript reactjs next.js

【解决方案1】：

问题是，客户端需要环境变量 BASE_URL。为了解决这个问题，我在 BASE_URL 前面添加了 NEXT_PUBLIC_

【讨论】：