jquery 带有$.getJSON()的canvasJS出现CORB错误

fjaof16o 于 2022-12-18 发布在 jQuery

关注(0)|答案(1)|浏览(136)

我在使用下面的脚本时遇到了一个CORB错误，我似乎找不到原因。

<script>

var chart = null;
var dataPoints = [];

window.onload = function() {

chart = new CanvasJS.Chart("chartContainer", {
    animationEnabled: true,
    theme: "light2",
    title: {
        text: "Daily Sales Data"
    },
    axisY: {
        title: "Sold For",
        titleFontSize: 24
    },
    data: [{
        type: "line",
        yValueFormatString: "$#,##0.00",
        dataPoints: dataPoints
    }]
});

$.getJSON("https://www.hostname.com/test/examples/01-overview/test.php?callback=?", callback);

}

function callback(data) {
    console.log(data.dps);
    for (var i = 0; i < data.dps.length; i++) {
        dataPoints.push({
            x: new Date(data.dps[i].date),
            y: data.dps[i].units
        });
    }
    chart.render();
}
</script>

我注意到示例中的格式是

callback({
   "dps":[
      {
         "date":"08/18/2020",
         "units":1550.00
      } //more here
   ]
})

我的PHP文件返回以下内容..

{"callback":[
    {"dps":[
        {
            "date":"08\/18\/2020",
            "units":"1550.00"
         }, {...}
    ]}
 ]}

型
我不知道这是不是原因...

jquery

来源：https://stackoverflow.com/questions/63549412/corb-error-with-canvasjs-with-getjson

1条答案

按热度按时间

xoefb8l81#

这里有三个基本问题：
1.您没有覆盖默认的Content-Type，因此PHP声明它正在输出HTML。当浏览器收到响应时，它看到它声明是HTML，因此不会将其作为JavaScript执行。（这就是触发您看到的错误的原因，但修复它只会暴露其他两个错误）。
1.您的JSONP格式不正确（正如您所怀疑的）。看起来您创建了一个带有回调键的关联数组，然后通过json_encode运行整个数组，而不仅仅是对JSONP的JSON部分进行编码。
1.您没有使用请求传递的回调名称，但是硬编码了callback
嗯，如果不算在2020年使用JSONP的话，有三个问题。
执行JSONP的正确方法如下所示：

<?php
    $data = do_stuff_to_get_the_data();
    if (!test_if_callback_is_safe($_GET['callback'])) {
       die();
    }
    header("Content-Type: application/javascript");
    echo $_GET('callback');
    echo "(";
    echo json_encode($data);
    echo ");";
    exit;

但是，你不应该使用JSONP，它有一些安全风险，它只允许你发出GET请求，它不能很好地支持客户端错误处理，它不能用来限制读取响应的来源：要么全有，要么全无。
输出JSON，使用CORS为浏览器提供权限，允许其他站点运行的JS读取：

<?php
    $data = do_stuff_to_get_the_data();
    header("Content-Type: application/json");
    header("Access-Control-Allow-Origin: *"); # Don't use a global wildcard if you can restrict this 
    echo json_encode($data); 
    exit;

在客户机上，不要在URL中包含?callback=?，因为这将触发jQuery中的JSONP模式。

赞(0）回复(0）举报 2022-12-18

我来回答

jquery 带有$.getJSON()的canvasJS出现CORB错误

1条答案

相关问题

热门标签

最新问答