渲染中的 Laravel + Vue 错误：“SyntaxError：JSON 中位置 0 的意外标记 u”

Posted 2023-03-14

【中文标题】渲染中的 Laravel + Vue 错误：“SyntaxError：JSON 中位置 0 的意外标记 u”

【英文标题】：Laravel + Vue Error in render: "SyntaxError: Unexpected token u in JSON at position 0"

【发布时间】：2021-06-30 08:40:09

【问题描述】：

我有一个带有 Vue js 的 Laravel 应用程序，直到不久前它运行良好。现在，当我转到使用 Vue js 的任何页面时，会出现此错误：[Vue warn]: Error in render: "SyntaxError: Unexpected token u in JSON at position 0"。 当我通过清除缓存（Mac OS 上的 Control + Shift + R）重新加载页面时，它再次工作，但是当我在没有此命令的情况下更新时，错误再次出现。

PS：我没有对 laravel 和 npm 进行任何软件包更新，它只是突然停止工作。

【问题讨论】：

你能发布一个包含 vuejs 代码的页面

【参考方案1】：

在控制台中试试这个：

JSON.parse(undefined)

你会得到什么：

Uncaught SyntaxError: Unexpected token u in JSON at position 0
    at JSON.parse (<anonymous>)
    at <anonymous>:1:6

换句话说，您的应用正在尝试解析 undefined，这是无效的 JSON。

这有两个常见的原因。首先是你可能引用了一个不存在的属性（如果不是在严格模式下，甚至是一个不存在的变量）。

window.foobar = '"some":"data"';
JSON.parse(window.foobarn)  // oops, misspelled!

第二个常见原因是一开始就无法接收 JSON，这可能是由于客户端脚本忽略错误并在不应该发送请求时发送的。

确保您的服务器端和客户端脚本都在 strict mode 中运行，并使用 ESLint 对它们进行 lint。这将使您确信没有错别字。

有时是因为let data = JSON.parse(this.response); 所以尝试将其更改为 let data = JSON.parse(this.responseText);

我真正做的是将this.response 更改为this.responseText