Desarrollo Web Lección 7 - Bases de Datos

En esta actividad utilizará PHP para conectarse a la base de datos y ejecutar una consulta.

• Cree un nuevo archivo llamado 'mysql.php' en su directorio de nivel superior en Visual Studio Code.
• Agregue el código PHP base para incluir el encabezado, el menú y el pie de página.

<?php
    // comienza el código HTML
    include('cabecera.php');
    include('menu.php');
?>

<?php
    // terminar código HTML
    include('pie.php');
?>

• Los objetos son una estructura de datos avanzada y no profundizaremos mucho aquí, pero deberá comprender un poco para usar la conexión de la base de datos PHP en esta actividad.
• Un objeto es como una matriz con nombre donde puede acceder a cada elemento por su nombre.
• Pero un objeto también tiene funciones incorporadas. Recuerde que en Javascript audio tiene funciones integradas como .play() e .paused() información integrada como .paused. Eso es porque audioes un objeto.
• De manera similar, en PHP, un objeto puede tener tanto datos como funciones. Por ejemplo, un objeto de conexión de base de datos puede tener información sobre la conexión y también funciones para extraer datos.
• Mientras que usted accede a la información en una matriz usando [], nosotros accedemos a la información y las funciones usando ->.
• Para usar un ejemplo abstracto, podríamos crear un objeto llamado $tabla.
• Podríamos establecer el número de patas de la mesa de la siguiente manera.

$mesa->patas = 4;

• También podríamos mover la mesa a otra ubicación de la siguiente manera.

$mesa->mover($ubicación);

• Hay toda una escuela de programación basada en objetos (Programación orientada a objetos) y los objetos pueden ser objeto de muchas clases, pero esto es todo lo que necesitas saber para usar la conexión a la base de datos.

• Si bien hay varias formas de conectarse a bases de datos en PHP, usaremos PDO para mayor seguridad.
• Copie el siguiente código en la parte superior del primer bloque de PHP.

    // Configurar la conexión a la base de datos
    define ('DBCONNECT', "/home/dh_9m7wr9/pdo.php"); // conexión a la base de datos
    include_once DBCONNECT;
    $db = 'techschoolwebdev';
    $dsn = "mysql:host=$db_host;dbname=$db;charset=utf8mb4";
    try
    { // conectar
        $pdo = new MyPDO($dsn, $db_user, $db_pass, $db_options);
    } catch (\PDOException $e) {
        throw new \PDOException ($e->getMessage(), (int)$e->getCode());
    }

• Como se describe en el comentario, este código configurará la conexión a la base de datos. Echemos un vistazo a cómo.
• La primera línea (define ('DBCONNECT', "../../pdo.php");) define una estática (variable inmutable) llamada DBCONNECT que contiene la dirección relativa de un archivo fuera del servidor web. Este archivo contiene nuestro host, nombre de usuario y contraseña para la base de datos, así como las opciones que usaremos para conectarnos. No queremos que estén disponibles en el servidor porque si PHP falla por algún motivo, nuestro código completo quedará expuesto a los usuarios y una persona malintencionada podría usar esta información para acceder a nuestra base de datos y arruinar nuestro sitio o usar nuestro servidor para actividades ilegales. Al almacenar los datos fuera del servidor web, el usuario nunca puede ver este detalle.
• A estos datos se accede incluyendo el archivo externo. include DBCONNECT;
• En la siguiente línea, definimos el nombre de la base de datos ($db = 'webdev';) porque cada aplicación/sitio podría usar una base de datos diferente, por lo que debemos definirla dentro de la aplicación/sitio.
• La cuarta línea crea una cadena con todos los detalles de nuestra conexión, incluido el host, el nombre de usuario y el juego de caracteres que usaremos. $dsn = "mysql:host=$db_host;dbname=$db;charset='utf8mb4'";
• El bloque final establece la conexión. Esto ocurre principalmente en $pdo = new MyPDO($dsn, $db_user, $db_pass, $db_options);, donde $pdo es un objeto que incluye tanto la conexión a la base de datos como las funciones necesarias para acceder a los datos.
• Envolvemos la conexión en un bloque try/ catch para manejar cualquier error que pueda ocurrir si falla la conexión. En tal caso, nuestro código arrojará una excepción que incluye un mensaje y el código de error.
• No es necesario recordar todo esto. Es suficiente saber dónde encontrarlo e incluirlo en su código para cada sitio.

• PDO mantiene nuestra base de datos a salvo de ataques de inyección directa al separar la consulta de los datos.
• Agregue el siguiente código en la parte inferior del primer bloque de PHP, después de include('menu.php');.

    $query = "SELECT heroes.character_name, hero_villain, first_appeared, power, movie
    FROM heroes
        LEFT JOIN appearances ON heroes.character_name=appearances.character_name";
    $args = array();

• Como puede ver, la primera línea es la consulta que creamos en la actividad anterior y la segunda línea crea una matriz que contendrá los datos que deseamos incluir como parte de la consulta.
• A continuación, debemos configurar la consulta enviando solo esos datos a la base de datos.

    $rslt  = $pdo->prepare($query);

• $rslt ahora es un objeto que contiene el resultado de nuestra consulta.
• Ahora podemos enviar con seguridad nuestros parámetros y hacer que la base de datos ejecute nuestra consulta.

    $rslt->execute($args);

• El paso final es recuperar los resultados de la consulta, lo que hacemos en un bucle para obtener nuestros datos línea por línea.
• Agregue el siguiente código después de $rslt->execute($args);

    while ($row = $rslt->fetch()) {

    }

• Este código obtiene una sola fila de datos del resultado de nuestra consulta $rslt y la almacena en la variable $row.
• Mostremos esa fila en nuestro registro de errores. Coloque el siguiente código dentro del archivo {}.

        error_log("MURRAY: query response row - " . print_r($row,1));

• Si actualiza su página y revisa sus registros, verá los datos de nuestra base de datos.
• Observe el nuevo uso de dos parámetros con print_r.
• El primer parámetro $rowes el contenido a mostrar.
• El segundo parámetro 1 le dice print_rque convierta el primer parámetro en una cadena, que luego se puede mostrar usando echoo error_log.
• Vamos a mostrar estos datos en HTML . Agregue el siguiente código entre los bloques de PHP.

    <main>
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Hero / Villain</th>
                    <th>First Appearance</th>
                    <th>Power</th>
                    <th>Movie</th>
                </tr>
            </thead>
            <tbody>
                
            </body>
        </table>
    </main>

• Esto muestra la fila de encabezado de una tabla para nuestros datos y prepara el cuerpo de la tabla para los datos en sí.
• Ahora, mueva el 'bucle while' dentro del cuerpo de la tabla. Deberá incluir las etiquetas para identificar el código PHP.

    <main>
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Hero / Villain</th>
                    <th>First Appearance</th>
                    <th>Power</th>
                    <th>Movie</th>
                </tr>
            </thead>
            <tbody>
<?php
            while ($row = $rslt->fetch()) {
                error_log("MURRAY: query response row - " . print_r($row,1));
    }
?>
            </tbody>
        </table>
    </main>

• Ahora hay dos formas principales de agregar el código HTML . Uno es como una cadena de PHP. Tenga en cuenta que las pestañas y las líneas nuevas no son obligatorias, pero facilitan la depuración de HTML.

<?php
    while ($row = $rslt->fetch()) {
        error_log("MURRAY: query response row - " . print_r($row,1));
        echo "\t\t\t\t<tr>\n";
        echo "\t\t\t\t\t<td>$row['character_name']</td>\n";
        echo "\t\t\t\t\t<td>$row['hero_villain']</td>\n";
        echo "\t\t\t\t\t<td>$row['first_appeared']</td>\n";
        echo "\t\t\t\t\t<td>$row['power']</td>\n";
        echo "\t\t\t\t\t<td>$row['movie']</td>\n";
        echo "\t\t\t\t</tr>\n";
    }
?>

• La otra es agregar el código HTML , luego insertar nuestros datos individualmente.

<?php
    while ($row = $rslt->fetch()) {
?>
                <tr>
                    <td><?php echo $row['character_name'];?></td>
                    <td><?php echo $row['hero_villain'];?></td>
                    <td><?php echo $row['first_appeared'];?></td>
                    <td><?php echo $row['power'];?></td>
                    <td><?php echo $row['movie'];?></td>
                </tr>
<?php
    }
?>

• Elige cualquiera que te guste. Prefiero el segundo porque es mucho más fácil de leer.
• Tenga en cuenta que debemos rodear cada segmento de código PHP en las etiquetas PHP. Tenga cuidado con esto, ya que es donde es más probable que cometa un error.

• Si bien lo que hemos hecho es excelente, parece que estamos reimprimiendo datos (publicados por primera vez, etc.) innecesariamente.
• Sería mejor presentar una línea para cada héroe con una lista de películas en las que han aparecido.
• Para hacer eso, empaquetemos los datos en otra matriz.
• Comente (o elimine) el código existente dentro del bucle while.
• Cree algo de espacio dentro del ciclo while y agregue el siguiente código a la primera línea.

        $hero_data[$row['character_name']]['hero_villain']   = $row['hero_villain'];

• Aquí estamos creando una matriz llamada $hero_datapara todos los héroes y dentro de eso, estamos creando una matriz para cada personaje ( $hero_data[$row['character_name']]).
• La matriz de caracteres tiene un elemento llamado 'hero_villain' con el valor extraído de la fila de datos actual.
• El truco es que si se repite el carácter, sobrescribirá los datos existentes y no nos importa. Es decir, $hero_data['Black Widow']['hero_villain']será 'Héroe' cada vez, por lo que no nos importa si se sobrescribe.
• Haz lo mismo para 'first_appeared' y 'power'.

        $hero_data[$row['character_name']]['first_appeared'] = $row['first_appeared'];
        $hero_data[$row['character_name']]['power']          = $row['power'];

• No queremos sobrescribir películas anteriores ya que las filas posteriores se procesan para el mismo carácter, por lo que debemos hacer algo un poco más complicado. Necesitamos agregar cada película al final de la lista.

        $hero_data[$row['character_name']]['movies']        .= $row['movie'] . "<br>";

• El <br> agregado después de cada película moverá cada una a su propia línea en la celda de la tabla para que sea más fácil de leer para el usuario.
• Ahora, para mostrar los datos de nuestro héroe, podemos recorrer la $hero_data matriz.

    foreach($hero_data as $name => $details) {

    }

• Debido a que $hero_dataes una matriz anidada (una matriz dentro de una matriz), $detailsen sí misma es una matriz.
• Ahora podemos generar nuestro código HTML usando $namey la $detailsmatriz.

                <tr>
                    <td><?php echo $name;?></td>
                    <td><?php echo $details['hero_villain'];?></td>
                    <td><?php echo $details['first_appeared'];?></td>
                    <td><?php echo $details['power'];?></td>
                    <td><?php echo $details['movies'];?></td>
                </tr>

• Ejecute este código para ver que muestra una sola fila de la tabla por héroe y enumera todas las películas (todas las capturadas en la base de datos) en la última celda.
• Aquí está el código final en caso de que tenga problemas con la ubicación de los distintos elementos.

• mysql.php
• resultados

Next: Exercises