List all data of an API in numerical list (Array)

Asked

Viewed 210 times

-2

I have this Array:

[tracks] => Array
        (
            [data] => Array
                (
                    [0] => Array
                        (
                            [title] => Amiga Da Minha Mulher
                            [artist] => Array
                                (
                                    [name] => Seu Jorge
                                )
                        )

                    [1] => Array
                        (
                            [title] => Tá Vendo Aquela Lua
                            [artist] => Array
                                (
                                    [name] => Exaltasamba
                                )
                        )

The amount of numbers after ['data'] is the number of songs, or is, varies a lot according to the playlist. I put only two as example, but in the API link you can see examples with everything.

In "tracks" has the list of songs + name of the artist of each song. How to list them like this:

01 - Friend of My Wife - Seu Jorge

02 - You See That Moon - Exaltasamba

And so it goes...

I try to do everything, but there’s always a mistake.

php html array api
  • 1

    But you want to list with php or javascript ?

  • "I try to do everything, but there’s always a mistake" - Please click on [Edit] and put in the code you tried to do and what error you’re making

  • @Isac only with php even, because I will put the list in a form!

1 answer

1


What you can do is

  1. Request the API using PHP Curl
  2. Transforming JSON into an Object
  3. Filter requested data (in case you want the song title and author)
  4. Mount an HTML with this data using <ul><li></li></ul>

Note: It is only necessary to place the API URL in the $urlAPI variable

Code:

<?php

$urlAPI = 'URL_API';

$curl = curl_init();
curl_setopt_array($curl, array(
    CURLOPT_RETURNTRANSFER => 1,
    /**
     * Observação: coloque sempre a opção 'CURLOPT_SSL_VERIFYPEER' como true, por questões de segurança.
     * Coloquei como false apenas para responder a resposta, pois precisava configurar o certificado na minha máquina.
     */
    CURLOPT_SSL_VERIFYPEER => false,
    CURLOPT_URL => $urlAPI
));

$dadosAPI = curl_exec($curl);
curl_close($curl);

$dadosAPI = json_decode($dadosAPI);
$dataTracks = $dadosAPI->tracks->data;

?>

<!DOCTYPE html>
<html dir="ltr" lang="pt-BR"> 
    <head>
    <meta charset="UTF-8" />
        <style type="text/css">
            ul {
                counter-reset: section;
                list-style-type: none;
            }

            li::before {
                counter-increment: section;
                content: counters(section,".") " ";
            }
        </style>
    </head>
    <body>
        <ul id="list"></ul>
    </body>
    <script>
        var ul = document.getElementById("list");
        <?php
            foreach($dataTracks as $data)
            {
        ?>
                var li = document.createElement("li");
                li.appendChild(document.createTextNode(' - <?php echo $data->title; ?> - <?php echo $data->artist->name; ?>'));
                ul.appendChild(li);
        <?php
            }
        ?>
    </script>
</html>

Browser other questions tagged php html array api

You are not signed in. Login or sign up in order to post.