获取报表数据以通过REST API在HTML中显示为数据表

我对REST API和Javascript知之甚少。但是，我现在需要为第三方公司的REST API工作，该公司为我的公司发送电子邮件并通过REST API获取报告数据。获取报表数据以通过REST API在HTML中显示为数据表

的数据可以通过GET方法与TOKEN的URL获得：https://www.probancemail.com/rest/stats/?&token= {platformtoken} JSON阵列的

示例如下：

{ 
"bounce":2, 
"campaign_external_id":"RT1-", 
"campaign_name":"RT1-Welcome1", 
"click":19, 
"delivered":333, 
"open":69, 
"sending_external_id":"RT-PWDE1-20170617", 
"sendingtime_ts":1497650423000, 
"sent":335, 
"spam":0, 
"template_external_id":"0193", 
"unsub":6 
}

我需要什么样的第一步是检索来自第三方的基于带有令牌的URL的JSON数据，并通过Jquery解析JSON数据并将其作为表格（HTML）显示在网页上。为了实现这一目标，我发现下面的Jquery代码：

<!DOCTYPE html> 
<html> 
<head> 
<script> 
var url = 'https://www.probancemail.com/rest/stats/?&token={platformtoken}' 

$(document).ready(function() { 
$.getJSON(url, 
function (json) { 
var tr=[]; 
for (var i = 0; i < json.length; i++) { 
    tr.push('<tr>'); 
    tr.push("<td>" + json[i].campaign_name + "</td>"); 
    tr.push("<td>" + json[i].campaign_external_id + "</td>"); 
    tr.push("<td>" + json[i].sending_external_id + "</td>"); 
    tr.push("<td>" + json[i].sent + "</td>"); 
    tr.push("<td>" + json[i].delivered + "</td>"); 
    tr.push("<td>" + json[i].open + "</td>"); 
    tr.push("<td>" + json[i].click + "</td>"); 
    tr.push("<td>" + json[i].spam + "</td>"); 
    tr.push("<td>" + json[i].unsub + "</td>"); 
    tr.push('</tr>'); 
} 
$('table').append($(tr.join(''))); 
}); 
</script> 
</head> 
<body> 

<table></table> 

</body> 
</html>

但是，此代码不能正常工作，我认为这是因为令牌，该功能的getJSON没有得到JSON。不过，我对此很陌生，所以我没有任何见解。

请你看看并帮我弄清楚问题所在？欢迎任何建议！ >>也许我不应该使用JQuery甚至？

在此先感谢！

来源

2017-06-22 xiaoting peng

看在网络选项卡，是Ajax请求实际上射击？ – Niels

我认为你需要得到platformtoken首先，可能在另一个请求中，您应该联系API的供应商，或者查看他们的文档。 –

@WoutervanVegchel是的，我有platformtoken，我只是没有把它放在这里，因为它是保密的。 –

我无法访问URL，我得到了访问被拒绝，所以我尝试用不同的URL，它的工作原理是这样..

你可以检查你的web服务无论是返回任何东西，或者如果有任何CORS发生

$(document).ready(function() { 
 
var url = "https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=true" 
 

 
$.getJSON(url, 
 
function (json) { 
 

 
var tr = $("<tr></tr>") 
 
for (var i = 0; i < json.results.length; i++) { 
 

 
var td = "<td>" + json.results[i].address_components[0].long_name+"</td>" 
 
$(tr).append(td); 
 
} 
 

 
$('table').append($(tr)); 
 
}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<table></table>

来源

2017-06-22 08:22:11 Atiq

Hello Atiq感谢您的输入！我已经使用您的输入更新了代码，并且出现错误“否”Access-Control-Allow-Origin'标题存在于请求的资源中。原因'null'因此不被允许访问。“>我认为它与令牌有关吗？在使用它之前，是否需要添加一个步骤来验证url？ –

似乎您尝试的url访问不允许CORS访问.. 你可以在URL的末尾附加“＆callback =？”并再试一次吗？ – Atiq

是的，我已经尝试过，但它不起作用......我不明白，因为通过在浏览器中单独输入URL，我可以在网页中获取JSON ...另外，我也收到了标题：接受\t text/html，application/xhtml + xml，application/xml; q = 0.9，*/*; q = 0的。8 接受编码gzip的\t，放气，BR 接受语言\t EN-US，EN; Q = 0.5 连接\t保活曲奇\t JSESSIONID = E531EFCA579352140AEC115BE6A451DD 主机\t www.probancemail.com 升级，Insecure-用户代理\t Mozilla/5.0（Windows NT 10.0; WOW64; rv：54.0）Gecko/20100101 Firefox/54.0 –

，你可以像这样的测试代码问题，它可能是：

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    var data=[{ 
     "bounce":2, 
     "campaign_external_id":"RT1-", 
     "campaign_name":"RT1-Welcome1", 
     "click":19, 
     "delivered":333, 
     "open":69, 
     "sending_external_id":"RT-PWDE1-20170617", 
     "sendingtime_ts":1497650423000, 
     "sent":335, 
     "spam":0, 
     "template_external_id":"0193", 
     "unsub":6 
    },{ 
     "bounce":2, 
     "campaign_external_id":"RT1-", 
     "campaign_name":"RT1-Welcome1", 
     "click":19, 
     "delivered":333, 
     "open":69, 
     "sending_external_id":"RT-PWDE1-20170617", 
     "sendingtime_ts":1497650423000, 
     "sent":335, 
     "spam":0, 
     "template_external_id":"0193", 
     "unsub":6 
    }]; 
    var tr=[]; 
    for (var i = 0; i < data.length; i++) { 
     tr.push('<tr>'); 
     tr.push("<td>" + data[i].campaign_name + "</td>"); 
     tr.push("<td>" + data[i].campaign_external_id + "</td>"); 
     tr.push("<td>" + data[i].sending_external_id + "</td>"); 
     tr.push("<td>" + data[i].sent + "</td>"); 
     tr.push("<td>" + data[i].delivered + "</td>"); 
     tr.push("<td>" + data[i].open + "</td>"); 
     tr.push("<td>" + data[i].click + "</td>"); 
     tr.push("<td>" + data[i].spam + "</td>"); 
     tr.push("<td>" + data[i].unsub + "</td>"); 
     tr.push('</tr>'); 
    } 
    $('table').append($(tr.join(''))); 
}) 
</script> 
</head> 
<body> 

<table></table> 

</body> 
</html>

或者你可以通过api自己测试你的代码，这个你现在可以做的。

来源

2017-06-22 08:26:51 ReggieLee

按照此为“否‘访问控制允许来源’错误

"No 'Access-Control-Allow-Origin' header is present on the requested resource"

来源

2017-06-22 11:52:35

获取报表数据以通过REST API在HTML中显示为数据表

回答

相关问题