本地Netlify功能服务器给出奇怪的响应，而不是FaunaDB数据

如何解决本地Netlify功能服务器给出奇怪的响应，而不是FaunaDB数据

我正在尝试使用Vue和FaunaDB构建一个简单的Web应用程序。尝试从数据库中获取数据时，出现以下错误：

localhost/:1 Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

当我从Netlify功能服务器打印响应时，这就是我得到的：

以下是vue页中试图获取数据的代码：

  created() {
EventService.readAll()
  .then(response => {
    this.events = response.data
  })

}

这是EventService模块：

const readAllDates = () => {
  console.log("hey")
  return fetch('/.netlify/functions/read-all-dates').then((response) => {
    console.log(response)
    return response.json()
  })
}

export default {
  readAll: readAllDates
}

这是我的read-all-dates.js：

import faunadb from 'faunadb'

const q = faunadb.query
const client = new faunadb.Client({
  secret: process.env.FAUNADB_SECRET
})

exports.handler = (event,context,callback) => {
  console.log("Function `read-all-dates` invoked")
  return client.query(q.Paginate(q.Match(q.Ref("indexes/all_dates"))))
  .then((response) => {
    const dateRefs = response.data
    console.log("Todo refs",dateRefs)
    console.log(`${dateRefs.length} todos found`)

    const getAllDateDataQuery = dateRefs.map((ref) => {
      return q.Get(ref)
    })
    // then query the refs
    return client.query(getAllDateDataQuery).then((ret) => {
      return callback(null,{
        statusCode: 200,body: JSON.stringify(ret)
      })
    })
  }).catch((error) => {
    console.log("error",error)
    return callback(null,{
      statusCode: 400,body: JSON.stringify(error)
    })
  })
}

我在做什么错了？

解决方法

原来是vue-router阻止了netlify代理将请求定向到正确的endint。开发人员似乎没有解决此问题的好方法： https://forum.vuejs.org/t/devserver-proxy-not-working-when-using-router-on-history-mode/54720

您发布的错误是值得您熟悉的错误！

localhost/:1 Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

实际上，这是当您尝试将某些内容解析为JSON时引起的，但实际上不是JSON。 <是一个迹象，表明请求响应可能是HTML而不是JSON。调试的下一步是在浏览器调试的“网络”面板中查看XHR请求本身。

根据我的经验，此错误的最常见原因之一是路由问题，该问题触发了为HTML提供服务而不是您期望的函数处理程序的404响应路由。