ajax 返回html不返回json,jQuery ajax调用返回HTML而不是JSON的Ajax响应

我正在为使用HighCharts的时间序列数据编写一个简单的查看器。可能发生的一个问题是,这些值可能会停止一段时间,然后恢复。在我的系统中,这些值最终会进入数据库,我不会丢失它们,它们只会延迟。我想在我的用户界面上,因为数据进来时,它每秒会正常滚动一次(如果工作正常的话)。如果数据停止,UI应该暂停滚动(这也在工作)。如果数据可用性在一段时间后恢复,那么我希望图表执行“填充差距”,即填充在不可用期间漏掉的部分。jQuery ajax调用返回HTML而不是JSON的Ajax响应

这就是我现在想要解决的问题。我发出同步的$ .ajax调用来获取缺少的数据,但返回的数据是页面本身的HTML,而不是JSON。我已经测试了服务器端调用,并且它从浏览器直接调用时返回JSON。所以任何人都可以看到我的“缺口填充”阴谋中出现了什么问题?在下面的代码中查看注释“data2这里是HTML而不是JSON出于某种原因”,它出错的地方。

谢谢 维吉尔

function log(msg) {

if (window.console && window.console.log) {

console.log(msg)

}

}

function pauseBtnHandler() {

pauseChart = !pauseChart

if (pauseChart) {

$('#pauseBtn').val('Resume Display')

}

else {

$('#pauseBtn').val('Pause Display')

}

}

function timestampToLocaldate(timestamp) {

return new Date(timestamp - TIMEZONE_OFFSET)

}

$(function() {

$(document).ready(function() {

$.ajaxSetup({ cache: false })

pauseChart = false

prevTimestamp = 0

prevScroll = true

dataStoppedTimestamp = false

// get localtime offset in minutes, then convert to ms for use with charting

offset = new Date().getTimezoneOffset()

TIMEZONE_OFFSET = -offset * 60 * 1000

SAMPLE_PERIOD = 1000

// Do an initial query to get the current latest timestamp (in ms since Epoch)

jQuery.ajax({

url: '/mgmt/currentValues',

success: function(data) {

now = data['timestamp'] * 1000 + TIMEZONE_OFFSET

},

error: function (xhr, ajaxOptions, thrownError) {

alert('Error getting initial timestamp, defaulting time to now ' + thrownError)

now = new Date().getTime()

},

async: false

});

var chart;

$('#chart').highcharts({

chart: {

type: 'spline',

animation: Highcharts.svg, // don't animate in old IE

backgroundColor:

{

linearGradient: [0, 0, 0, 500],

stops: [

[0, 'rgb(160, 160, 160)'],

[1, 'rgb(0, 0, 0)']

]

},

events: {

load: function() {

var series1 = this.series[0];

setInterval(function() {

$.get("mgmt/currentValues",function(data, status){

if (!pauseChart) {

var timestamp = data['timestamp'] * 1000 + TIMEZONE_OFFSET

// Only scroll the chart if a more recent value has come in

dt = timestamp - prevTimestamp

var scroll = (dt > 0)

if (!scroll) {

dataStoppedTimestamp = timestamp

}

// Determine if gap fill required

if (prevScroll == false && scroll == true && dt > SAMPLE_PERIOD) {

log('doing gapfill from ' + timestampToLocaldate(dataStoppedTimestamp) + ' to ' + timestampToLocaldate(timestamp))

jQuery.ajax({

url:'/mgmt/getdatafortimeperiod/%d/%d' % (dataStoppedTimestamp, timestamp),

success: function(data2) {

// data2 here is HTML not JSON for some reason

log(data2)

for (row2 in data2) {

var timestampGf = row2['timestamp'] * 1000 + TIMEZONE_OFFSET

series1.addPoint([timestampGf, row2['cpuPct']], false, true)

}

},

error: function (xhr, ajaxOptions, thrownError) {

alert('Error getting gapfill data ' + thownError)

},

async: false

});

}

series1.addPoint([timestamp, data['cpuPct']], scroll, true)

log(timestampToLocaldate(timestamp) + ' ' + data['cpuPct'])

prevTimestamp = timestamp

prevScroll = scroll

}

});

}, SAMPLE_PERIOD);

}

}

},

title: {

text: 'PERFORMANCE DATA',

style: {

color: 'black',

fontWeight: 'bold',

fontSize: '1.5em',

fontFamily: 'Arial',

}

},

xAxis: {

type: 'datetime',

tickPixelInterval: 150,

labels: {

style: {

color: 'white',

fontFamily: 'Arial',

},

}

},

yAxis: [{

lineWidth: 1,

min: 0,

labels: {

style: {

color: 'white',

fontFamily: 'Arial',

},

},

title: {

text: 'CPU (%)',

style: {

color: 'white',

fontWeight: 'bold',

fontSize: '16px',

fontFamily: 'Arial',

}

}

}],

tooltip: {

formatter: function() {

str = ''+ this.series.name +'
'+

Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'
'+

Highcharts.numberFormat(this.y, 0);

return str;

}

},

legend: {

enabled: true,

itemStyle: {

color: 'white',

font: 20,

},

backgroundColor: '#1C1C1C',

margin: 30,

itemDistance: 22,

symbolWidth:22,

symbolHeight:16,

},

exporting: {

enabled: true

},

series: [{

name: 'CPU %',

color: '#FF0000',

data: (function() {

// generate an initial array of data

var data = [],

time = now,

i;

for (i = -39; i <= 0; i++) {

data.push({

x: time + i * SAMPLE_PERIOD,

y: 0

});

}

return data;

})()

},

]

});

});

});

+1

尝试在您的ajaxsetup中添加'dataType:“json”'并查看是否有效 –

2014-08-30 19:21:39

+0

非常好的建议,但错误仍然存​​在。 –

2014-08-30 19:33:12

+1

您是否检查过发送ajax请求的实际url?您的请求是否将其转换为服务器方法? –

2014-08-30 20:41:52

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值