獲取報表數據以通過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中顯示爲數據表

回答

相關問題