了解和使用API​​的

Question

我正在开发一个react-express项目。

在后端，我制作了一个小API，用于在my/API /路由上传输一些信息。只是一个JSON对象。

事情是，我不知道我该如何将这些信息放在我的前端并使用它。

我使用该项目作为学习练习。我从来没有使用过API。

我的主要问题（我认为）是英语不是我的第一语言。所以当我试图谷歌这个问题时，我得到各种结果，因为我可能没有使用正确的话。

任何帮助，将不胜感激！

Answer 1

您通常使用JSON HTTP请求来提取数据。假设您有一条路线/API/myData，它返回一个JSON格式的响应。您的服务器代码应该如下所示：

app.get('/API/myData', function(request, response) { 
    response.json(myData); 
}); 

在您的反应应用程序中，您可以使用任何请求库来获取此数据。例如request：

var request = require('request'); 
request('localhost/API/mydata', function (error, response, body) { 
    if (!error && response.statusCode == 200) { 
     var result = JSON.parse(body); // here is your JSON data 
    } 
}); 

这只是一个起点。您应该看看快速示例，请求示例和其他类似的库来熟悉它。

Answer 2

我在这里使用window.fetch，因为这是最简单的事情（即使它尚未在所有浏览器中支持）。你也可以使用jQuery的ajax函数或任何数量的东西。

fetch('https://httpbin.org/ip') 
 
    .then(data => data.json()) 
 
    .then(json => document.getElementById('your-ip').innerHTML = json.origin)

Your IP is: <div id="your-ip"></div>