简体   繁体   English

有关自己的REST API和使用第三方API提取的问题

[英]Question about own REST API and Fetch with 3rd Party API

I'm working on a backend to create a node js server to grab information from the IGDB API and display specific information. 我正在一个后端上创建节点js服务器,以从IGDB API中获取信息并显示特定信息。 I'm new to node js with express and javascript so maybe I am completely missing something but here it goes. 我是Express和JavaScript节点JS的新手,所以也许我完全错过了一些东西,但是事情就这样了。

I want to start off with creating an endpoint to search games through the IGDB API 我想开始创建一个端点来通过IGDB API搜索游戏

`app.get('/test', (req, res) => {
    res.header("Access-Control-Allow-Origin", "*");
    res.header(
        "Access-Control-Allow-Headers",
        "Origin, Content-Type, Accept"
    )
        fetch("https://api-v3.igdb.com/games", {
            headers: {
                "user-key": "MY_KEY",
                Accept: "application/json"
            },
            method:"POST",
            body:`fields name; search "halo"; where version_parent = null;`
        })
            .then((response) => {
                return response.json();
            })
            .then((response) => {
                res.send(response);
            })
            .catch((err)=>{
                console.log(err);
            })
});`

This does send me the raw JSON Data to the game in the search body(in this case halo). 这确实将原始JSON数据发送给我在搜索正文中的游戏(在本例中为晕圈)。 So I am able to use this Endpoint already but I have to hardcode the name in the Body parameter. 因此,我已经可以使用此端点,但是我必须在Body参数中对名称进行硬编码。 Now I have a second Javascript file that's linked to a html file that contains this code: 现在,我有第二个Javascript文件,该文件链接到包含以下代码的html文件:

    test.addEventListener('click',()=>{

    fetch("http://localhost:3000/test",{
    })
        .then((response)=>{
            return response.json();
        })
        .then((response)=>{

        })
  });

For test reasons I just have a button to get the JSON information from the Endpoint. 出于测试原因,我只有一个按钮可以从端点获取JSON信息。

Here I just want to grab the endpoint and then use the response to show the data in my html file. 在这里,我只想获取端点,然后使用响应将数据显示在html文件中。 As I mentioned before the actual getting the information part works fine but the Problem I have now reached is that I do not now how to feed a search variable to my /test Endpoint. 正如我之前提到的,实际获取信息部分可以正常工作,但是我现在遇到的问题是我现在不知道如何将搜索变量提供给/ test端点。 I need to be able to search for a game that a user types through html, so my thought was that I somehow have to be able too pass a variable from my second Javascript file to the endpoint but I don't know how to do that, so I am looking for help here. 我需要能够搜索用户通过html键入的游戏,所以我的想法是我还必须能够将变量从第二个Javascript文件传递到端点,但是我不知道该怎么做。 ,所以我在这里寻求帮助。

You can add a query parameter in your express API. 您可以在express API中添加查询参数。 ie

app.get('/test', (req, res) => {
    ...
    let search = req.query.search;
    fetch("https://api-v3.igdb.com/games", {
       ...
       body: 'fields name; search "' + search + '"; where version_parent = null;'
     })
     ...
});

And then in your second JS script; 然后在第二个JS脚本中;

test.addEventListener('click',() => {
    let search = document.getElementById("search-term").value;
    fetch("http://localhost:3000/test?search=" + search, ...})
    ...
});

Provided that you have an input in your HTML file; 前提是您在HTML文件中有输入;

<input type="text" name="name" id="search-term" value="value" />

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM