通過JavaScript處理json對象與反應

所以我試圖建立一個應用程序。我有一個Java API，它將數據庫中的數據作爲json對象提供。這我想通過使用JavaScript的HTML網站，並作出反應可視化。我這一段代碼，開始與我的javascript代碼通過JavaScript處理json對象與反應

const url = 'localhost:8080/getcomments?testcaseid=1'; 
fetch(url) 
    .then(response => response.json()) 
    .then(data => { 
     var rootElement = 
     React.createElement('div', {}, 
      React.createElement('h1', {}, "test"), 
      React.createElement('ul', {}, 
      React.createElement('li', {}, 
       React.createElement('h2', {}, data.comment) 
      ) 
     ) 
     ) 
    ReactDOM.render(rootElement, document.getElementById('react-app')) 
    });

的URL返回時，在瀏覽器中

[{"id":50,"testcaseId":1,"userId":1,"comment":"dit is voor de eerste testcase"}]

運行但是當我運行這與HTML頁面我只是得到了一個空白頁面。然後，我認爲這可能是反應代碼，並將data.comment更改爲「你好」，但也沒有回報。當我在取回之外複製反應片時，我得到一些回報。另外，當我運行html頁面時，我的Java API沒有得到任何迴應。但是當我運行這個url時，我得到了很多回應。我在做什麼錯？

來源

2017-04-17 stevedc

make rootElement global？它的內部的匿名函數...添加* var rootElement; *到第一行刪除其他變量... –

我試過這個，但我沒有得到我的API的任何反應？ – stevedc

它似乎永遠不會進入函數本身 – stevedc

您可以嘗試先調試響應。

嘗試

.then((response) => { 
    var parseResult = response.json(); 
    console.log(parseResult); 
    return parseResult; 
})

確保JSON數據是正確的第一，那麼你就可以調試代碼做出反應。

來源

2017-04-17 10:23:31

我這樣做，並在控制檯中，我得到了下一個錯誤到控制檯「index.html：1 Fetch API無法加載http：// localhost：8080/getcomments？testcaseid = 1在請求的資源上沒有'Access-Control-Allow-Origin'標頭，因此不允許Origin'null'訪問，如果一個不透明的響應符合你的需求，請設置請求模式爲'no-cors'禁用CORS的資源。「 – stevedc

在Chrome中使用插件瞭解了這一點。而且我看到了我的對象，但是如何獲得同一個對象？ – stevedc

CORS問題。你是否從其他域請求？嘗試在請求上添加標頭以允許跨源請求。 –

通過JavaScript處理json對象與反應

回答

相關問題