API 数据打印到节点中的控制台，但不在 html 中显示

Question

我的目标是做一个简单的获取请求并将数据显示到 HTML 页面。

所以首先我在 node.js 中设置请求来测试它。 使用节点，当我使用console.log(response)运行它时，数据正确显示。

当我尝试将数据显示到页面时，问题就来了。 基本上，当我尝试document.getElementByID('demo').innerHTML = response; 我什至尝试只使用警报但无济于事。

我显然做错了什么，但我对 JavaScript 不够熟悉。

<!DOCTYPE html>
<html>
<head>

</head>
<body>

<p id="demo"></p>

<script>

//causes error in html. Required for node.
// var XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;

var HttpClient = function() {
    this.get = function(aUrl, aCallback) {
              var anHttpRequest = new XMLHttpRequest();
                anHttpRequest.onreadystatechange = function() { 
                if (anHttpRequest.readyState == 4 && anHttpRequest.status == 200)
                   aCallback(anHttpRequest.responseText);
                }

            anHttpRequest.open( "GET", aUrl, true );            
              anHttpRequest.send( null );
        }
}

var theURL = 'https://XXXXXX..';
var client = new HttpClient();
let thisReply = null;
client.get(theURL, function(response) {
//   var response1 = JSON.parse(response);
    // alert(response1);
    // console.log(response);
    document.getElementById('demo').innerHTML = response;
});

</script>
</body>
</html>

Answer 1

@PrerakSola 和 @Abdullah Danyal 在主要帖子评论中回答了这个问题。 “我检查了，我看到一个控制台错误，说从源 'http://...' 在 'APILINK' 访问 XMLHttpRequest 已被 CORS 策略阻止：没有 'Access-Control-Allow-Origin' Z099FB995346F339EFZ 存在60DBF339E439在请求的资源上”

回答：“您需要在 API 服务器上启用 CORS。如果您使用 node 和 express，请参阅：expressjs.com/en/resources/middleware/cors.html”

Answer 2

假设这不是文档找不到您要查找的元素的问题，您可以尝试.innerText = response 或将您的 innerHTML 元素包装在一些 HTML 元素中： <p>${response}</p>我敢肯定除了 api 响应之外，还要注销该元素，以确保您抓住了正确的东西。

API 数据打印到节点中的控制台，但不在 html 中显示

问题描述

2 个解决方案

解决方案1
0 已采纳 2019-10-30 19:44:43

解决方案2
0 2019-10-30 19:51:48

API 数据打印到节点中的控制台，但不在 html 中显示

问题描述

2 个解决方案

解决方案1 0 已采纳 2019-10-30 19:44:43

解决方案2 0 2019-10-30 19:51:48

解决方案1
0 已采纳 2019-10-30 19:44:43

解决方案2
0 2019-10-30 19:51:48