Javascript 无法访问在本地节点服务器上创建的API_Javascript_Html_Node.js_Api

Javascript 无法访问在本地节点服务器上创建的API

javascript html node.js api

Javascript 无法访问在本地节点服务器上创建的API,javascript,html,node.js,api,Javascript,Html,Node.js,Api,我在节点服务器上创建了一个简单的API。服务器正在端口9000上运行。我创建了一个名为getUserDetails的端点，并传递了一个简单的对象。问题是我可以通过输入完整URL“”从浏览器访问API 但我无法访问另一个HTML文件中的API。为了详细说明，我创建了一个简单的HTML文件来测试这个API 我的节点服务器： const app = express(); app.get('/getUserDetails', (req, res) => { res.send({

我在节点服务器上创建了一个简单的API。服务器正在端口9000上运行。我创建了一个名为getUserDetails的端点，并传递了一个简单的对象。问题是我可以通过输入完整URL“”从浏览器访问API

但我无法访问另一个HTML文件中的API。为了详细说明，我创建了一个简单的HTML文件来测试这个API

我的节点服务器：

const app = express();

app.get('/getUserDetails', (req, res) => {
    res.send({
        firstname : 'Giri',
        secondname: 'Aakula',
        dob: '15-09-1997',
        age: 22,
        qualification : 'Graduate',
        status : 'pass'
    })
})
app.listen(9000);

我的HTML文件

<!DOCTYPE html>
<html>
<head>
    <title>Test page</title>
    <style>
        h1{
            font-size: 50px;
        }
    </style>  
</head>
<script>
    fetch('http://localhost:9000/getUserDetails')
  .then(
    function(response) {
      if (response.status !== 200) {
        console.log('Looks like there was a problem. Status Code: ' +
          response.status);
        return;
      }

      // Examine the text in the response
      response.json().then(function(data) {
        console.log(data);
      });
    }
  )
  .catch(function(err) {
    console.log('Fetch Error :-S', err);
  });
</script>
<body>
    <h1>This is a test page</h1>
</body>
</html>


测试页
h1{
字体大小：50px；
}
取（'http://localhost:9000/getUserDetails')
.那么(
功能（响应）{
如果（response.status！==200）{
console.log（'看起来有问题。状态代码：'+
答复（现状）；
返回；
}
//检查回复中的文本
response.json（）.then（函数（数据）{
控制台日志（数据）；
});
}
)
.catch（函数（err）{
log（'Fetch Error:-S'，err）；
});
这是一个测试页面

我忘了添加COR。通过添加这一行，解决了我的问题

const express = require('express');
const app = express();

app.get('/getUserDetails', (req, res) => {
    //this is the updated line
    res.setHeader('Access-Control-Allow-Origin', '*'); 

    res.send({
        firstname : 'Giri',
        secondname: 'Aakula',
        dob: '15-09-1997',
        age: 22,
        qualification : 'Graduate',
        status : 'pass'
    })
})
app.listen(9000);

您可以通过访问此URL来测试是否允许cors？访问控制允许来源：*在chrome/mozilla的开发控制台（f12按钮）中，控制台选项卡中是否有错误？您在网络选项卡中有什么？您还可以将console.log放在您的应用程序中。get（'/getUserDetails'，（req，res）=>{console.log（“getUserDetails被调用”…}），并查看它是否在您用来启动express的控制台中被调用