Skip to content
Advertisement

How to create a json php api that only connects given with the expo react native app?

I have the following PHP code where I intend to convert it into an API to show my sports news that is hosted in a PHP application and the data stored in MYSQL, so I want to show those records of my news in an application developed in Expo React Native.

$stmt = $con->prepare("SELECT
                            url,
                            cover_page,
                            alt_img,
                            mini_title,
                            mini_description,
                            date_post,
                            confg_img,
                            main_cover
                        FROM news ORDER BY id_news DESC LIMIT 5");

    //$stmt->bind_param("i", $id);
    $stmt->execute();
    $member = array();
    $stmt->bind_result(
        $member['url'],
        $member['cover_page'],
        $member['alt_img'],
        $member['mini_title'],
        $member['mini_description'],
        $member['date_post'],
        $member['confg_img'],
        $member['main_cover']
    );

    //Los {}corchetes " " especifican un objeto y " []" se utilizan para matrices de acuerdo con la especificación JSON.
    header('Content-Type: application/json');
    //header('Content-type: application/json; charset=utf-8');
    echo '[';
    $count = 0;
    while ($stmt->fetch()) {
        if( $count ) {
            echo ',';
        }

        //echo json_encode($member, JSON_UNESCAPED_SLASHES);
        echo json_encode($member, JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT | JSON_FORCE_OBJECT);

        ++$count;
    }

    echo ']';

The code already generates a JSON structure for me, printing the data in JSON in such a way:

   [{
        "url": "es/deportes/futbol/ecuador/ligapro/serie-a/679/oscar-bagui-es-el-hombre-record-en-emelec",
        "cover_page": "https://i.imgur.com/UI5IaZ5.jpg",
        "alt_img": "Oscar Bagui ",
        "mini_title": "Oscar Bagui es el hombre ru00e9cord en Emelec",
        "mini_description": "El defensa elu00e9ctrico sigue siendo importante para los elu00e9ctricos",
        "date_post": "2020-12-13 21:24:37",
        "confg_img": null,
        "main_cover": "featured_news"
    },{
        "url": "es/deportes/futbol/ecuador/ligapro/serie-a/675/la-dirigencia-de-liga-de-quito-quiere-cerrar-el-fichaje-de-este-jugador-del-extranjero",
        "cover_page": "https://i.imgur.com/7p6l5ZA.jpg",
        "alt_img": "Posible fichaje de Liga de Quito desde la MLS",
        "mini_title": "La dirigencia de Liga de Quito quiere cerrar el fichaje de este jugador del extranjero",
        "mini_description": "Los albos quieren potenciar su plantilla para 2021",
        "date_post": "2020-12-13 13:56:45",
        "confg_img": null,
        "main_cover": "relevant_news"
    }]

But I this route example.com/api/json.php I have to create a code, a key that allows only the connection with the application only the app that has the access key with the application will show the data, this key in some Examples that I have seen, I realize that some parameters pass through the url.

So my question is, how to print the data in expo react native but that the data call is linked with a key between the app and the api json php

Advertisement

Answer

First , in your app , you have a secret key (e.g. Stackoverflow1234#@$%x) which nobody knows.

and in your php, you can use this

<?php

if ( isset($_REQUEST['key']) && $_REQUEST["key"]== "Stackoverflow1234#@$%x") {

/// codes to connect to your DB and generate the JSON


}
?>

and in your react-native app, you can use https://www.yourdomain.com/xxx.php?key=Stackoverflow1234#@$%x to get the data, such as:

 return fetch('https://www.yourdomain.com/xxx.php?key=' + secretkey)
         .then((response) => response.json())
         .then((responseJson) => {
           this.setState({
             retrievedata: responseJson          
             
           }, function() {
             // In this block you can do something with new state.
                          
           });
         })
         .catch((error) => {
           console.error(error);
         });

User contributions licensed under: CC BY-SA
1 People found this is helpful
Advertisement