获取API Rest并通过Json+Html

我需要帮助，我有一个api和访问密钥"https://api-redemet.decea.mil.br/mensagens/metar/SBKP?api_key=XXXXX"。当我直接调用浏览器时，它会返回Json中的信息。

我需要从返回呼叫中得到一个标签"；mens"：它从"每小时"返回这个更新的数据；METAR SBKP 290100Z 13012KT CAVOK 18/14 Q1020="；

一个朋友帮助我使用了另一个相同风格的API，他创建了一个本地html来捕获一些标签。

我今天使用的Html。

<!DOCTYPE html>
<html lang="pt-br">
    <head>
    <title>Metar</title>
        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
        <script>
            $(document).ready(function(){
                $.ajaxSetup({ cache: false });
                setInterval(function() {
                    $.getJSON('https://api.radarbox.com/v2/airports/SBKP/metar', { bearerToken: "XXXXXXXX" })
                        .done(function(data) {
                        
                        var text = `<table>
                                        <tr style="background-color: #C4C4C4">
                                        <td><span style="color: rgb(255, 255, 0);"><strong>Metar SBKP ${data.apiMetar.observationTime}</strong></span></td>
                                                                                </tr>
                                                                        
                                                                            </table>`
                                    
                        $(".mypanel").html(text);
                    });
                }, 9000);
            });
        </script>
    </head>
    <body>
        <div class="mypanel"></div>
    </body>
</html>

新的API返回：

{"status":true,"message":200,
"data":
{"current_page":1,
"data":[{"id_localidade":"SBKP","validade_inicial":"2021-04-29 01:00:00","mens":"METAR SBKP 290100Z 13012KT CAVOK 18/14 Q1020=","recebimento":"2021-04-29

我需要得到这些信息"；mens"："；METAR SBKP 290100Z 13012KT CAVOK 18/14 Q1020=">

并写入更改${data.apiMetar.observationTime}的html

另一个问题，第一个Api使用bearerToken和新的？

Api信息-->https://ajuda.deca.mil.br/base-de-conhecimento/api-redemet-mensage-metar/

帮助的Tks

假设这是您的JSON对象

{
    "status":true,
    "message":200,
"data": 
{
    "current_page":1,
    "data":[{
        "id_localidade":"SBKP",
        "validade_inicial":"2021-04-29 01:00:00",
        "mens":"METAR SBKP 290100Z 13012KT CAVOK 18/14 Q1020=",
        "recebimento":"2021-04-29 
    }]
}

更新后的代码应该是这样的：

$.getJSON('https://api.radarbox.com/v2/airports/SBKP/metar', { bearerToken: "XXXXXXXX" })
.done(function(data) {
var text = `<table>
                <tr style="background-color: #C4C4C4">
                <td><span style="color: rgb(255, 255, 0);"><strong>Metar SBKP ${data.data[0]['mens']}</strong></span></td>
                                                        </tr>
                                                
                                                    </table>`
            
$(".mypanel").html(text);
});

感谢您的帮助。我不是一个开发人员，所以我赶上了它kkkkkkkk

我通过这个调用更改了HTML，但没有显示任何内容。我不知道我是否从api_key传来了正确的电话——旧的电话是：$.getJSON('https://api.radarbox.com/v2/airports/SBKP/metar', { bearerToken: "ac3e1a8bXXXXXXX" })和我看到的新的直接在URL中通知你，可能是我通知错了，我这样通知：$.getJSON(https'api-redemet.decea.mil.br/mensagens/metar/SBKP?api_key=FEG1OXXXXXXXX'})

Html现在是：

<!DOCTYPE html>
<html lang="pt-br">
    <head>
    <title>Metar</title>
        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
        <script>
            $(document).ready(function(){
                $.ajaxSetup({ cache: false });
                setInterval(function() {
                    $.getJSON('https://api-redemet.decea.mil.br/mensagens/metar/SBKP?api_key=FEG1OXXXXXX'})
                        .done(function(data) {
                        
                        var text = `<table>
                                        <tr style="background-color: #C4C4C4">
                                        <td><span style="color: rgb(255, 255, 0);"><strong>Metar SBKP ${data.data[0]['mens']}</strong></span></td>
                                                                                    </tr>
                                                                                                                            
                                                                            </table>`
                                    
                        $(".mypanel").html(text);
                    });
                }, 1000);
            });
        </script>
    </head>
    <body>
        <div class="mypanel"></div>
    </body>
</html>

相关内容

最新更新

热门标签：