JSON中的意外令牌u答案

【问题标题】：Unexpected token u in JSONJSON中的意外令牌u
【发布时间】：2017-06-08 22:36:51
【问题描述】：

我有一个发送和检索字符串的 Ajax 函数。一旦 Ajax 接收到字符串，它就会调用一个名为 drawChart 的函数。 drawChart 然后使用 JSON.parse 将该字符串转换为数组我还使用 Google Charts 使用传入的数据创建图表。一切正常。图表正在制作中，但是看起来一切正常；我在控制台中收到此错误：

Uncaught (in promise) SyntaxError: Unexpected token u in JSON at 位置 0 在 JSON.parse() 在 drawChart (index.js?c1496931740:24) 匿名

我确实研究了这个错误，它发生在JSON.parse 中传递的数据类型未定义时。我尝试使用console.log(typeof(data)) 来检查它是否真的是未定义的，但它输出了两件事。首先它输出字符串，然后输出未定义。之后，它显示错误，但图表显示成功。这是我的代码：

function aggregator(field, size) {
    /*Build jSON query string*/
    var jString = '{"aggs": { "group_by_date": { "terms": { "field": "' + field + '", "size" : ' + size + '} } } }';

    google.charts.setOnLoadCallback(drawChart);   /*Load Chart*/

    /*Sending and retrieving data using Ajax*/
    $.ajax({
        url: 'index.php',
        type: 'post',
        datatype: 'json',
        data: {
            qSet: jString,
            size: size
        },
        success: drawChart
    });
}

var drawChart = function(data)
{   
    console.log(typeof(data));
    data = JSON.parse(data);  /*Convert the data back into an array*/

    var chartData = new google.visualization.DataTable();  /*Set up the chart*/

    chartData.addColumn('string', 'year'); 
    chartData.addColumn('number', 'Records');

    /*For loop to add rows*/
    for (var i = 0; i < data.length; ++i){
        chartData.addRow(data[i]);
    }

    var options = {
        title: 'Arrival Data'
    };

    var chart = new google.visualization.BarChart(document.getElementById('chartContainer'));
    chart.draw(chartData, options);
};

这个错误的原因是什么？为什么我在执行 console.log(typeof(data)) 时会收到 2 个输出（字符串然后未定义）？我该如何解决？

【问题讨论】：

您应该使用 JSON.stringify(yourjsonstring) 方法来创建 Json 并将其发送到服务器。现在你只发送字符串。
@guest271314 — 问题告诉你：“首先它输出字符串，然后输出未定义”
@NumanKIZILIRMAK — 是什么让您认为服务器期望数据是 JSON 编码而不是 application/x-www-form-urlencoded？
datatype 应该是dataType
@guest271314 —“您提到 $.ajax() 中的数据是先前评论中的字符串，而不是未定义” — 阅读我以前的 cmets。阅读我的答案。该函数被调用两次。传递给第一个参数的值每次都不同。

标签： javascript json ajax

【解决方案1】：

为什么我在执行 console.log(typeof(data)) 时会收到 2 个输出（字符串然后未定义）？

因为你调用了两次函数。

google.charts.setOnLoadCallback(drawChart);
success: drawChart

只有在获取数据时才调用它。

google.charts.setOnLoadCallback 允许您指定在 API 可用时运行的函数。

创建一个新函数来发出 Ajax 请求并在 API 加载时调用它。

google.charts.setOnLoadCallback(sendAjaxRequest); /*Load Chart*/

function sendAjaxRequest() {

  $.ajax({
    url: 'index.php',
    type: 'post',
    datatype: 'json',
    data: {
      qSet: jString,
      size: size
    },
    success: drawChart
  });
}

【讨论】：