Como usuario root:
- Editamos el archivo de configuración de Apache (
/etc/httpd/httpd.conf).
Descomentamos las líneas:
#LoadModule rewrite_module lib/httpd/modules/mod_rewrite.so#Include /etc/httpd/extra/httpd-vhosts.conf
Modificamos la opción ServerName, quedando de la siguiente forma:
ServerName slackware.red.virtual:80
- Modificamos el archivo
/etc/httpd/extra/httpd-vhosts.conf, quedando de la siguiente forma:
# Virtual Hosts
#
<VirtualHost *:80>
DocumentRoot "/srv/httpd/htdocs"
ServerName localhost
ErrorLog "/var/log/httpd/error_log"
CustomLog "/var/log/httpd/access_log" common
</VirtualHost>
<VirtualHost *:80>
DocumentRoot "/srv/httpd/htdocs/alumno.red.virtual"
ServerName alumno.red.virtual
ErrorLog "/var/log/httpd/alumno.red.virtual/error_log"
CustomLog "/var/log/httpd/alumno.red.virtual/access_log" common
Options FollowSymLinks
RewriteEngine on
<Directory "/srv/httpd/htdocs/alumno.red.virtual">
AllowOverride FileInfo
</Directory>
</VirtualHost>- Creamos la estructura de directorios/archivos para el VirtualHost
root@slackware:~# mkdir -p /srv/httpd/htdocs/alumno.red.virtual/
root@slackware:~# chown -R alumno:apache /srv/httpd/htdocs/alumno.red.virtual/
root@slackware:~# mkdir -p /var/log/httpd/alumno.red.virtual/
root@slackware:~# chown -R apache:users /var/log/httpd/alumno.red.virtual/-
Agregamos al final de
/etc/hostsla siguiente línea:10.0.2.15 alumno.red.virtual alumno -
Verificamos que todo este en orden:
root@slackware:~# httpd -f /etc/httpd/httpd.conf -t
Syntax OK
root@slackware:~# ping -c 4 alumno.red.virtual
PING alumno.red.virtual (10.0.2.15) 56(84) bytes of data.
64 bytes from alumno.red.virtual (10.0.2.15): icmp_req=1 ttl=64 time=0.027 ms
64 bytes from alumno.red.virtual (10.0.2.15): icmp_req=2 ttl=64 time=0.030 ms
64 bytes from alumno.red.virtual (10.0.2.15): icmp_req=3 ttl=64 time=0.035 ms
64 bytes from alumno.red.virtual (10.0.2.15): icmp_req=4 ttl=64 time=0.032 ms
--- alumno.red.virtual ping statistics ---
4 packets transmitted, 4 received, 0% packet loss, time 2999ms
rtt min/avg/max/mdev = 0.027/0.031/0.035/0.003 ms- Reinciamos al demonio de Apache:
root@slackware:~# /etc/rc.d/rc.httpd restart
root@slackware:~# netstat -plutn | grep httpd
tcp6 0 0 :::80 :::* LISTEN 1968/httpd
- Con el navegador web accedemos a
http://alumno.red.virtual.
Como usuario alumno ingresa a /srv/httpd/htdocs/alumno.red.virtual, crea los directorios archivos, css y js. Posteriromente crea los siguientes archivos con su correspondiente contenido:
prueba.html
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/codigo.js"></script>
<link rel="stylesheet" type="text/css" href="css/estilo.css" />
</head>
<body>
<h1>AJAX</h1>
<form id="id_form">
<fieldset>
<legend>Formulario</legend>
<p>
<label for="input_text">input_text:</label>
<input type="text" name="input_text" id="input_text" />
</p>
<p>
<input type="button" value="Descargar" id="input_button" />
</p>
</fieldset>
</form>
<h1>Resultado:</h1>
<table id="resultado"></table>
</body>
</html>js/codigo.js
function alCargar() {
return function() {
/* Variable "global" */
var xhr;
function realizarSolicitudHttp() {
/*var servidor = "http://alumno.red.virtual";*/
var servidor = "http://" + window.location.host;
var archivo = document.getElementById("input_text").value;
if (!archivo) {
alert("Ingrese el nombre de un archivo");
return false;
}
/*
* Para evitar que el navegador web use su cache de la página:
* var url = servidor + ":" + window.location.port + "/" + archivo + (new Date()).getTime();
* Documentación: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime
*/
var url = servidor + ":" + window.location.port + "/" + archivo;
xhr = new XMLHttpRequest();
xhr.onreadystatechange = agregarContenidoDeArchivo;
xhr.open('GET', url);
xhr.send();
}
function agregarContenidoDeArchivo() {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
/* Procesamos el archivo xml */
var documento_xml = xhr.responseXML;
var xml_nodos = documento_xml.firstChild.childNodes;
var tabla = document.getElementById("resultado");
var tabla_tbody = document.createElement("tbody");
tabla.appendChild(tabla_tbody);
for (var i=1; i < xml_nodos.length; i++) {
var tabla_tr = document.createElement("tr");
var nodo_elemento = xml_nodos[i].childNodes;
var tabla_contador = document.createElement("td");
tabla_contador.textContent = i;
tabla_tr.appendChild(tabla_contador);
for (var j=0; j < nodo_elemento.length; j++) {
var tabla_td = document.createElement("td");
tabla_td.textContent = nodo_elemento[j].textContent;
tabla_tr.appendChild(tabla_td);
}
tabla_tbody.appendChild(tabla_tr);
}
} else if (xhr.status === 403) {
alert('Error: 403 Forbidden.');
} else if (xhr.status === 404) {
alert('Error: 404 Not Found.');
} else {
alert('Error: xhr.status');
}
}
}
/* Desactiva el "action" del formulario */
document.getElementById("id_form").onsubmit = function() { return false; };
var boton = document.getElementById("input_button");
boton.addEventListener("click", realizarSolicitudHttp);
}
}
document.addEventListener("DOMContentLoaded", alCargar(), false);css/estilo.css
/* Hola de estilo */
body {
background-color: #DFE32D;
}
pre table {
background-color: #B6BA18;
}
table, thead, th, tbody, tr, td {
border: solid 1px #fff;
font-size: 10px;
}- En el anfitrión (Windows) busca un archivo con nombre
hosts(muy similar a/etc/hostsde GNU/Linux), posiblemente lo encuentres en el directorioC:\Windows\System32\drivers\etc, y agrega al final la línea127.0.0.1 http://alumno.red.virtual. Finalmente accede con un navegador web desde el anfitrión a http://alumno.red.virtual:8080
- Descarga de http://www.correosdemexico.gob.mx/ServiciosLinea/Paginas/DescargaCP.aspx el archivo XML de algún estado.
- Guarda el archivo que descargues de SEPOMEX en
/srv/httpd/htdocs/alumno.red.virtual/archivoscon el nombrecp.xml. - Solicita el archivo
archivos/cp.xmlmediante el formulario enprueba.html.