lunes, 20 de julio de 2015

Autenticacion al iniciar una pagina en html con htpasswd

El generador htpasswd crea contraseñas que se generan aleatoriamente mediante el algoritmo MD5, lo que significa que se puede utilizar para los sitios alojados en cualquier plataforma, incluyendo Windows y Linux. 

1. Crear al archivo htpasswd dentro del directorio de html con el siguiente codigo:

  • cd /var/www/html
  • htpasswd -c /var/www/html/.htpasswd katty(usuario a crear)
  • Al ejecutar el comando se debe ingresar la contraseña y volver a confirmar la misma

2. Visualizar el archivo generado de autentificacion con el siguiente comando:
  • cat .htpasswd

3. Añadir las siguientes lineas de código en el archivo httpd.conf para la autentificacion correspondiente cerrar y guardar:


  • cd /etc/httpd/conf
  • gedit httpd.conf



#direccion de la ubicacion del archivo a autenticar
<Directory "/var/www/html">
#autenticacion basica
AuthType Basic
#Mensaje que aparecera al abrir la pagina desde el explorador
AuthName "Autenticarse"
#direccion del archivo .htpasswd
AuthUserFile /var/www/html/.htpasswd
#permitir usuarios validos
Require valid-user
</Directory>



4. Reiniciar el servicio de httpd con el siguiente comando:
  • systemctl restart httpd
5. Ingresar al navegador localhost y aparecerá lo anteriormente creado para la autentificación de la pagina de inicio:













domingo, 19 de julio de 2015

Actualizar datos de MySQL con Tomcat

1. Ingresar el siguiente codigo para la actualizacion de datos :

-------------------------------------
datos.jsp
-------------------------------------

<%@ page language="java" %>
<%@ page import = "java.sql.Connection"%>
<%@ page import = "java.sql.DriverManager"%>
<%@ page import = "java.sql.ResultSet"%>
<%@ page import = "java.sql.Statement"%>
<html>
<body>
<h1>DATOS PERSONALES</h1>
<%
try
{
   // Conexion con bd
   Class.forName("com.mysql.jdbc.Driver");
   Connection conexion = DriverManager.getConnection("jdbc:mysql://localhost/katty", "root", "");
   if (!conexion.isClosed())
   {
      // La consulta
      Statement st = conexion.createStatement();
      ResultSet rs = st.executeQuery("select CI,nombre,apellido,telefono from datos" );

      // Ponemos los resultados en un table de html
      out.println("<table border=\"1\"><tr><td>CI</td><td>Nombre</td><td>Apellido</td><td>Telefono</td></tr>");
      while (rs.next())
      {
         out.println("<tr>");
         out.println("<td>"+rs.getObject("CI")+"</td>");
         out.println("<td>"+rs.getObject("nombre")+"</td>");
         out.println("<td>"+rs.getObject("apellido")+"</td>");
         out.println("<td>"+rs.getObject("telefono")+"</td>");
 
         out.println("</tr>");
      }
      out.println("</table>");

      // cierre de la conexion
      conexion.close();
   }
   else
      // Error en la conexion
      out.println("fallo");
}
catch (Exception e)
{
   // Error en algun momento.
   out.println("Excepcion "+e);
   e.printStackTrace();
}
%>

 
<br>
<center>
<br>
<form action="modi.jsp">
<label>nombre</label>
                <input id="c3" name="nombre" type="text" />
            <input id="c33" name="3" type="submit" value = " Actualizar"/>
        </form>
<form action="modia.jsp">
<label>apellido</label>
                <input id="c3" name="apellido" type="text" />
            <input id="c33" name="3" type="submit" value = " Actualizar"/>
        </form>
<form action="modit.jsp">
<label>telefono</label>
                <input id="c3" name="telefono" type="text" />
            <input id="c33" name="3" type="submit" value = " Actualizar"/>
        </form>
<form action="http://localhost:8080/index.jsp">
<input type="submit" value="REGRESAR">
</form>
</center>
</body>
</html>
------------------------------------------------------------------------------
modi.jsp
------------------------------------------------------------------------------


<%@ page language="java" %> 
<%@ page import = "java.sql.Connection"%> 
<%@ page import = "java.sql.DriverManager"%> 
<%@ page import = "java.sql.ResultSet"%> 
<%@ page import = "java.sql.Statement"%> 

<html> 
<HEAD> 
</HEAD> 
<body> 
<form> 


                    <a href="datos.jsp"><input type="button" value="Regresar"></a> 

                    
</form> 
<% 
String nombre1 = request.getParameter("nombre"); 
try 
   // Conexion con bd 
   Class.forName("com.mysql.jdbc.Driver"); 
   Connection conexion = DriverManager.getConnection("jdbc:mysql://localhost/katty", "root", ""); 
   if (!conexion.isClosed()) 
   { 
      // La consulta 
      Statement st = conexion.createStatement(); 
      st.executeUpdate("UPDATE datos SET nombre = '"+nombre1+"'" ); 

       // cierre de la conexion 
      conexion.close(); 
   } 
   else 
      // Error en la conexion 
      out.println("fallo"); 
catch (Exception e) 
   // Error en algun momento. 
   out.println("Excepcion "+e); 
   e.printStackTrace(); 

%> 
</body> 
</html>

------------------------------------------------------------------------------
modia.jsp
------------------------------------------------------------------------------


<%@ page language="java" %> 
<%@ page import = "java.sql.Connection"%> 
<%@ page import = "java.sql.DriverManager"%> 
<%@ page import = "java.sql.ResultSet"%> 
<%@ page import = "java.sql.Statement"%> 

<html> 
<HEAD> 
</HEAD> 
<body> 
<form> 


                    <a href="datos.jsp"><input type="button" value="Regresar"></a> 

                    
</form> 
<% 
String apellido1 = request.getParameter("apellido"); 
try 
   // Conexion con bd 
   Class.forName("com.mysql.jdbc.Driver"); 
   Connection conexion = DriverManager.getConnection("jdbc:mysql://localhost/katty", "root", ""); 
   if (!conexion.isClosed()) 
   { 
      // La consulta 
      Statement st = conexion.createStatement(); 
      st.executeUpdate("UPDATE datos SET apellido = '"+apellido1+"'" ); 

       // cierre de la conexion 
      conexion.close(); 
   } 
   else 
      // Error en la conexion 
      out.println("fallo"); 
catch (Exception e) 
   // Error en algun momento. 
   out.println("Excepcion "+e); 
   e.printStackTrace(); 

%> 
</body> 
</html>

------------------------------------------------------------------------------
modi.jsp
------------------------------------------------------------------------------


<%@ page language="java" %> 
<%@ page import = "java.sql.Connection"%> 
<%@ page import = "java.sql.DriverManager"%> 
<%@ page import = "java.sql.ResultSet"%> 
<%@ page import = "java.sql.Statement"%> 

<html> 
<HEAD> 
</HEAD> 
<body> 
<form> 


                    <a href="datos.jsp"><input type="button" value="Regresar"></a> 

                    
</form> 
<% 
String telefono1= request.getParameter("telefono"); 
try 
   // Conexion con bd 
   Class.forName("com.mysql.jdbc.Driver"); 
   Connection conexion = DriverManager.getConnection("jdbc:mysql://localhost/katty", "root", ""); 
   if (!conexion.isClosed()) 
   { 
      // La consulta 
      Statement st = conexion.createStatement(); 
      st.executeUpdate("UPDATE datos SET telefono= '"+telefono1+"'" ); 

       // cierre de la conexion 
      conexion.close(); 
   } 
   else 
      // Error en la conexion 
      out.println("fallo"); 
catch (Exception e) 
   // Error en algun momento. 
   out.println("Excepcion "+e); 
   e.printStackTrace(); 

%> 
</body> 
</html>

2. Abrir el navegador desde el cual se podra visualizar lo creado anteriormente







Conexión Remota a una base de datos desde MySQL con Tomcat



1. Abrir el archivo  de configuración con el siguiente comando:


  • gedit /etc/my.cnf


  • 2.Añadir la siguiente linea dentro del archivo abierto anteriormente:

    • bind-address=0.0.0.0





    3. Ingresar a mysql para dar lo permisos necesarios para que se pueda acceder a la base de datos remota y permitir también al otro usuario acceder a nuestra base de datos  con el siguiente comando:


    • mysql -u root -p
    • use katty ;
    • GRANT ALL PRIVILEGES ON *.* to 'root'@'%' IDENTIFIED BY 'laboratorio4';
    4. Editar la conexión de la pagina a conectarse de la siguiente manera:
    • primero se debe copiar los archivos de conexión y paginas de jsp del usuario al cual se va a conectar 
    • se debe cambiar localhost por la ip de la maquina a la cual se quiera acceder con su correspondiente base de datos, usuario y contraseña
    • localhost -> 172.17.36.165:3306




    ----------------------------------------------------------

    ac,jsp
    --------------------------------------------------------

    <%@ page language="java" %>
    <%@ page import = "java.sql.Connection"%>
    <%@ page import = "java.sql.DriverManager"%> 
    <%@ page import = "java.sql.ResultSet"%> 
    <%@ page import = "java.sql.Statement"%> 
    <html>
    <html>
    <HEAD>
      <SCRIPT LANGUAGE="JavaScript">
      <!---
        
        function Hola() {
        
          alert("Personal");
        

        }
        function Adios() {

          alert("Academicos");
        
        }
      // --->
      </SCRIPT>
    </HEAD>
    <body>
    <form>


            <center>
                    <img src="13.jpg">
            </center>
     <table align="center">
              
                    <tr>
                        <td>
                        <a href="da.jsp"><input type="button" value="Datos Personales"></a>

                        </td>



                        <td>
                        <a href="ac.jsp"><input type="button" value="Datos Academicos"></a>
                        </td>
                        
                    </tr>
                </table>
    </form>
    <%

    try
    {
       // Conexion con bd
       Class.forName("com.mysql.jdbc.Driver");
       Connection conexion = DriverManager.getConnection("jdbc:mysql://172.17.36.165:3306/mysql", "root", "laboratorio4");
       if (!conexion.isClosed())
       {
          // La consulta
          Statement st = conexion.createStatement();
          ResultSet rs = st.executeQuery("select * from acade" );

          // Ponemos los resultados en un table de html
          out.println("<center><table border=\"1\"><tr><td>ID</td><td>MATERIA</td><td>NOTA</td></tr>");
          while (rs.next())
          {
             out.println("<tr>");
             out.println("<td>"+rs.getObject("idemateria")+"</td>");
             out.println("<td>"+rs.getObject("materia")+"</td>");
             out.println("<td>"+rs.getObject("nota")+"</td>");
             
           
             out.println("</tr>");
          }
          out.println("</table></center>");

          // cierre de la conexion
          conexion.close();
       }
       else
          // Error en la conexion
          out.println("fallo");
    }
    catch (Exception e)
    {
       // Error en algun momento.
       out.println("Excepcion "+e);
       e.printStackTrace();
    }

    %>
    </body>
    </html>
    ------------------------------------------------------
    da.jsp
    --------------------------------------------------------
    <%@ page language="java" %>
    <%@ page import = "java.sql.Connection"%>
    <%@ page import = "java.sql.DriverManager"%> 
    <%@ page import = "java.sql.ResultSet"%> 
    <%@ page import = "java.sql.Statement"%> 
    <html>
    <html>
    <HEAD>
      <SCRIPT LANGUAGE="JavaScript">
      <!---
        
        function Hola() {
        
          alert("Personal");
        

        }
        function Adios() {

          alert("Academicos");
        
        }
      // --->
      </SCRIPT>
    </HEAD>
    <body>
    <form>


            <center>
                    <img src="13.jpg">
            </center>
     <table align="center">
              
                    <tr>
                        <td>
                        <a href="da.jsp"><input type="button" value="Datos Personales"></a>

                        </td>



                        <td>
                        <a href="ac.jsp"><input type="button" value="Datos Academicos"></a>
                        </td>
                        
                    </tr>
                </table>
    </form>
    <%

    try
    {
       // Conexion con bd
       Class.forName("com.mysql.jdbc.Driver");
       Connection conexion = DriverManager.getConnection("jdbc:mysql://172.17.36.165:3306/mysql", "root", "laboratorio4");
       if (!conexion.isClosed())
       {
          // La consulta
          Statement st = conexion.createStatement();
          ResultSet rs = st.executeQuery("select * from datosjhon" );

          // Ponemos los resultados en un table de html
          out.println("<center><table border=\"1\"><tr><td>Cedula</td><td>Nombre</td><td>Apellido</td><td>Direccion</td></tr>");
          while (rs.next())
          {
             out.println("<tr>");
             out.println("<td>"+rs.getObject("cedula")+"</td>");
             out.println("<td>"+rs.getObject("nombre")+"</td>");
             out.println("<td>"+rs.getObject("apellido")+"</td>");
             out.println("<td>"+rs.getObject("direccion")+"</td>");
           
             out.println("</tr>");
          }
          out.println("</table></center>");

          // cierre de la conexion
          conexion.close();
       }
       else
          // Error en la conexion
          out.println("fallo");
    }
    catch (Exception e)
    {
       // Error en algun momento.
       out.println("Excepcion "+e);
       e.printStackTrace();
    }

    %>
    </body>
    </html>

    -------------------------------------------------------
    index.jsp
    -------------------------------------------------------

    <%@ page language="java" %> 
    <%@ page import = "java.sql.Connection"%> 
    <%@ page import = "java.sql.DriverManager"%>  
    <%@ page import = "java.sql.ResultSet"%>  
    <%@ page import = "java.sql.Statement"%>  
    <html> 
    <HEAD> 
      <SCRIPT LANGUAGE="JavaScript"> 
      <!--- 
         
        function Hola() { 
         
          alert("Personal"); 
         
        } 
        function Adios() { 
          alert("Academicos"); 
         
        } 
      // ---> 
      </SCRIPT> 
    </HEAD> 
    <body> 
    <form> 
            <center> 
                    <img src="13.jpg"> 
            </center> 
     <table align="center"> 
               
                    <tr> 
                        <td> 
                        <a href="da.jsp"><input type="button" value="Datos Personales"></a> 
                        </td> 
                        <td> 
                        <a href="ac.jsp"><input type="button" value="Datos Academicos"></a> 
                        </td> 
                         
                    </tr> 
                </table> 
    </form> 
    </body> 
    </html>



    5. Actualizar mysql para que se pueda guardar todos los cambios efectuados con el siguiente comando

    • systemctl restart mysql
    6.Abrir el explorador e ingrear la ip de nuetsra maquina con el pueto 8080 y asi se podra acceder a la base de datos remotamente,
    • 172.17.36.155:8080



    viernes, 26 de junio de 2015

    Conexión Postgres - Tomcat

    1. Descargar el JDBC de la versión del Postgres que se tenga instalado

    2.Copiar el JDBC en la carpeta de lib de Tomcat con el siguiente comando:

    • mv postgresql-9.4-1201.jdbc4.jar /opt/tomat/lib


    3. Reiniciar el servicio de Catalina para que pueda reconocer el JDBC de PostgreSQL con el siguiente comando:
    • $CATALINA_HOME/bin/starup.sh



    4.Abrir y modificar el archivo index.jsp el cual contrendra dos botones para poder visualizar los datos personales o datos del estudiante mediante una conexion JDBC con los siguientes comandos:
    • cd /opt/tomcat/webapps/ROOT

    • gedit index.jsp

    • codigo que se debe pegar en el archivo:
    <%@page contentType="text/html" pageEncoding="UTF-8"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd"&gt>

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Inicio</title>
    </head>
    <body>
    <center>
    <marquee><h1>Bienvenidos!! </h1></marquee>
    </center>
    <br /><hr />

    <center>
    //boton para llamar a la conexion con la base de datos katty
    <form action="http://localhost:8080/datos.jsp">
    <input type="submit" value="DATOS PERSONALES">
    </form>
    <br>
    //boton para llamar a la conexion con la base de datos katty
    <form action="http://localhost:8080/datose.jsp">
    <input type="submit" value="DATOS ESTUDIANTIL">
    </form>
    </center>
    </body>
    </html>


    Nota: los botones creados llaman a las paginas datos.jsp y datose.jsp los cuales se creara en el siguiente paso.

    5.Crear  el archivo datos.jsp y copiar el texto siguiente:
    • gedit datos.jsp
    • copiar dentro del archivo creado:
    //llama  a los paquetes que contiene el jar de JDBC de postgres
    <%@ page language="java" %>
    <%@ page import = "java.sql.Connection"%>
    <%@ page import = "java.sql.DriverManager"%>
    <%@ page import = "java.sql.ResultSet"%>
    <%@ page import = "java.sql.Statement"%>
    <html>
    <body>
    <h1>DATOS PERSONALES</h1>
    <%
    try
    {
       // Conexion con la base de datos creada en mi caso es katty con su respectivo usuario y contraseña
       Class.forName("com.postgres.jdbc.Driver");
       Connection conexion = DriverManager.getConnection("jdbc:postgres://localhost/katty", "postgres", "");
       if (!conexion.isClosed())
       {
          // Realiza la consulta que el usuario desea visualizar de la tabla creada anteriormente
          Statement st = conexion.createStatement();
          ResultSet rs = st.executeQuery("select CI,nombre,apellido,telefono from datos" );

          // Se pone los datos que muestra la consuta en una tabla de html 
          out.println("<table border=\"1\"><tr><td>CI</td><td>Nombre</td><td>Apellido</td><td>Telefono</td></tr>");
          while (rs.next())
          {
    // debe contener los nombres de los mismos campos que se crearon en la tabla caso contrario no se mostrara ningun dato
             out.println("<tr>");
             out.println("<td>"+rs.getObject("CI")+"</td>");
             out.println("<td>"+rs.getObject("nombre")+"</td>");
             out.println("<td>"+rs.getObject("apellido")+"</td>");
             out.println("<td>"+rs.getObject("telefono")+"</td>");
               
             out.println("</tr>");
          }
          out.println("</table>");

          // Se termina la conexion
          conexion.close();
       }
       else
          // Error en la conexion
          out.println("fallo");
    }
    catch (Exception e)
    {
       // Error en la conexion al momento de que se quiere conectar con la base de datos o tabla 
       out.println("Excepcion "+e);
       e.printStackTrace();
    }
    %>
    <br>
    <center>
    <br>

    //boton que llama a la pagina de inicio index.jsp
    <form action="http://localhost:8080/index.jsp">
    <input type="submit" value="REGRESAR">
    </form>
    </center>
    </body>
    </html>

    6.Crear  el archivo datose.jsp y copiar el texto siguiente:
    • gedit datose.jsp
    • copiar dentro del archivo creado:
    //llama  a los paquetes que contiene el jar de JDBC de postgres
    <%@ page language="java" %>
    <%@ page import = "java.sql.Connection"%>
    <%@ page import = "java.sql.DriverManager"%>
    <%@ page import = "java.sql.ResultSet"%>
    <%@ page import = "java.sql.Statement"%>
    <html>
    <body>
    <h1>DATOS PERSONALES</h1>
    <%
    try
    {
       // Conexion con la base de datos creada en mi caso es katty con su respectivo usuario y contraseña
       Class.forName("com.postgres.jdbc.Driver");
       Connection conexion = DriverManager.getConnection("jdbc:postgres://localhost/katty", "postgres", "");
       if (!conexion.isClosed())
       {
          // Realiza la consulta que el usuario desea visualizar de la tabla creada anteriormente
          Statement st = conexion.createStatement();
          ResultSet rs = st.executeQuery("select CI,nombre,apellido,telefono from datos" );

          // Se pone los datos que muestra la consuta en una tabla de html 
          out.println("<table border=\"1\"><tr><td>Nombre</td><td>Apellido</td><td>Universidad</td><td>Nivel</td><td>Mencion</td></tr>");
          while (rs.next())
          {
    // debe contener los nombres de los mismos campos que se crearon en la tabla caso contrario no se mostrara ningun dato
             out.println("<tr>");
             out.println("<td>"+rs.getObject("nombre")+"</td>");
             out.println("<td>"+rs.getObject("apellido")+"</td>");
                out.println("<td>"+rs.getObject("universidad")+"</td>");
                out.println("<td>"+rs.getObject("nivel")+"</td>");
                out.println("<td>"+rs.getObject("mencion")+"</td>");
             out.println("</tr>");
          }
          out.println("</table>");

          // Se termina la conexion
          conexion.close();
       }
       else
          // Error en la conexion
          out.println("fallo");
    }
    catch (Exception e)
    {
       // Error en la conexion al momento de que se quiere conectar con la base de datos o tabla 
       out.println("Excepcion "+e);
       e.printStackTrace();
    }
    %>
    <br>
    <center>
    <br>

    //boton que llama a la pagina de inicio index.jsp
    <form action="http://localhost:8080/index.jsp">
    <input type="submit" value="REGRESAR">
    </form>
    </center>
    </body>
    </html>

    7.Visualizar desde el navegador el archivo index.jsp con el siguiente url
    • localhost:8080

    • clic botón DATOS PERSONALES
    • clic botón DATOS ESTUDIANTIL










    Instalacion de Postgres

    ¿Qué es PostgreSQL?


    PostgreSQL es un sistema de gestión de bases de datos objeto-relacional, distribuido bajo licencia BSD y con su código fuente disponible libremente. Es el sistema de gestión de bases de datos de código abierto más potente del mercado. PostgreSQL utiliza un modelo cliente/servidor y usa multiprocesos en vez de multihilos para garantizar la estabilidad del sistema. Un fallo en uno de los procesos no afectará el resto y el sistema continuará funcionando. 
    • · El proyecto PostgreSQL sigue actualmente un activo proceso de desarrollo a nivel mundial gracias a un equipo de desarrolladores y contribuidores de código abierto.
    • ·  PostgreSQL es ampliamente considerado como una de las alternativas de sistema de bases de datos de código abierto.

     Características principales


     En las últimas versiones se pueden destacar las siguientes características principales:

    • ·  Es una base de datos 100% ACID.
    • · Soporta distintos tipos de datos: además del soporte para los tipos base, también soporta datos de tipo fecha, monetarios, elementos gráficos, datos sobre redes (MAC, IP ...), cadenas de bits, etc.
    • ·  También permite la creación de tipos propios.
    • ·  Incluye herencia entre tablas, por lo que a este gestor de bases de datos se le incluye entre los gestores objeto-relacionales.
    • ·  Copias de seguridad en caliente (Online/hot backups)
    • ·  Unicode
    • ·  Juegos de caracteres internacionales
    • ·  Regionalización por columna
    • ·  Multi-Version Concurrency Control (MVCC)
    • ·  Multiples métodos de autentificación
    • ·  Acceso encriptado via SSL
    • ·  SE-postgres
    • ·  Completa documentación
    • ·  Licencia BSD
    • ·  Disponible para Linux y UNIX en todas sus variantes (AIX, BSD, HP-UX, SGI IRIX, Mac OS X, Solaris, Tru64) y Windows 32/64bit.

    Instalación de Postgres en Centos 

       1.Agregar Postgres al repositorio con el siguiente comando:
    • rpm -iUvh http://yum.postgresql.org/9.4/redhat/rhel-7-x86_64/pgdg-centos93-9.4-1.noarch.rpm

    2. Actualizar los paquetes disponibles con el siguiente comando:

    • yum -y update
    3.Correr la instalacion de PostgreSQL con el siguiete comando:

    • yum -y install postgresql94 postgresql94-server postgresql94-contrib postgresql94-libs --disablerepo=* --enablerepo=pgdg94

    4.Iniciar el servicio de PostegreSQL con el siguiente comando.
    • systemctl enable postgresql-9.4
    5.Ingresar a PostgreSQL con e usuario del sistema con el siguiente comando:

    • su - postgres
    6.Conectarse al terminal del PostgreSQL con el siguiente comando:
    • psql

    Creación de base de datos y tablas en PostgreSQL


    7.Crear una base de datos en PostgreSQL  con el siguiente comando:
    • createdb katty
    8.Indicar que se quiere trabar con la base de datos antes creada con el siguiente comando:
    • psql katty
    9.Crear la tabla con sus correspondientes campos con el siguiente comando:
    • create table datos (CI varchar(10), nombre varchar(15), apellido varchar(15), telefono varchar(10), universidad varchar(50), nivel varchar(3), mencion varchar(15));

    10.Insertar datos en la tabla datos anteriormente creada con el siguiente comando:
    • insert into datos values ('1234567890','katherine','ramos','2846798','UPS','10','telematica');

    11. Visualizar datos ingresados con el siguiente comando: 
    • select * from datos;














    sábado, 6 de junio de 2015

    Visualizar archivo xml en html

    Para visualizar un archivo xml en una pagina html se deb utilizar html y Javascript para lo cual se debe seguir los siguientes pasos:


    1.Ingresar a la direccion /var/www/html para crear los archivos correspondientes de xml y html

    2.Crear el archivo xml con el siguiente comando:
    • gedit datos.xml


    3. dentro del archivo datos.xml pegar el siguiente codigo:

    <CATALOGO>
        <CD>
            <TITULO>Universidad Politecnica Salesiana</TITULO>
            <ARTISTA>Katherine Ramos</ARTISTA>
            <ORIGEN>AR</ORIGEN>
            <PRECIO>5.90</PRECIO>
            <ANO>2006</ANO>
        </CD>
        <CD>
            <TITULO>La Lengua Popular</TITULO>
            <ARTISTA>Andres Calamaro</ARTISTA>
            <ORIGEN>AR</ORIGEN>
            <PRECIO>9.90</PRECIO>
            <ANO>2007</ANO>
        </CD>
    </CATALOGO>



    3.Crear archivo html con el siguiente código:
    • gedit index.html


    4.Dentro del archivo index ingresar el siguiente código:

    <html>
    <body>

    <script type="text/javascript">
    var xmlDoc=null;
    if (window.ActiveXObject)
    {// code for IE
    xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    }
    else if (document.implementation.createDocument)
    {// code for Mozilla, Firefox, Opera, etc.
    xmlDoc=document.implementation.createDocument("","",null);
    }
    else
    {
    alert('Tu navegador no soporta esta funcion');
    }
    if (xmlDoc!=null)
    {
    xmlDoc.async=false;
    xmlDoc.load("catalogo.xml");
    var x=xmlDoc.getElementsByTagName("CD");

    document.write("<table border='1'>");
    document.write("<thead>");
    document.write("<tr><th>Artista</th><th>Album</th></tr>");
    document.write("</thead>");

    document.write("<tfoot>");
    document.write("<tr><th colspan='2'>Esta es mi coleccion de albums</th></tr>");
    document.write("</tfoot>");

    for (var i=0;i<x.length;i++)
    {
    document.write("<tr>");
    document.write("<td>");
    document.write(x[i].getElementsByTagName("ARTISTA")[0].childNodes[0].nodeValue);
    document.write("</td>");

    document.write("<td>");
    document.write(x[i].getElementsByTagName("TITULO")[0].childNodes[0].nodeValue);
    document.write("</td>");
    document.write("</tr>");
    }
    document.write("</table>");
    }
    </script>

    </body>
    </html>





    5.Reinicar el servidor httpd para que se guarden los cambios efectuados:


    6.Ingresar a localhost desde el navegador para visualizar los datos: