Publica tu página web con Raspberry Pi desde casa
Sin duda uno de los proyectos más interesantes y versátiles que puedes llevar a cabo con una Rapsberry Pi; en este artículo, te guiaré paso a paso para que puedas configurar tu propio servidor desde casa con NGINX, modifiques los ajustes de tu enrutador y compres y configures tu propio dominio web con Namecheap.
Ten en cuenta que, aunque muy barato, tendrás que sacar la tarjeta de crédito para comprar un dominio (un nombre de página web, como www.ardumaster.com). Puedes encontrar buenos nombres desde unos céntimos por dominios poco usados hasta por alrededor de 8€/año por un dominio .com. El resto del procedimiento es totalmente gratuito, así que, si te animas, ¡vamos a empezar!
Servidor NGINX
Lo primero que haremos es instalar el servidor y después lo configuraremos para que muestre tu página web de forma local.
Instalación
Instalar el servidor web NGINX es sencillo, basta con el siguiente comando:
sudo apt install nginxPodrás comprobar que ya está funcionando visitando la IP de tu Raspberry con un navegador web:
Aparte de esto, puedes comprobar el estado del servidor con el siguiente comando:
ardumaster@little-monkey:~ $ systemctl status nginx
● nginx.service - A high performance web server and a reverse proxy server
Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset: enabled)
Active: active (running) since Tue 2023-05-09 19:44:31 CEST; 4min 1s ago
Docs: man:nginx(8)
Main PID: 3443 (nginx)
Tasks: 5 (limit: 2059)
CGroup: /system.slice/nginx.service
├─3443 nginx: master process /usr/sbin/nginx -g daemon on; master_process on;
├─3444 nginx: worker process
├─3445 nginx: worker process
├─3446 nginx: worker process
└─3447 nginx: worker processRecuerda añadir una excepción si tenias un cortafuegos, por ejemplo ufw:
ardumaster@little-monkey:~ $ sudo ufw allow 'Nginx HTTP'
Rules updated
Rules updated (v6)
ardumaster@little-monkey:~ $ sudo ufw status
Status: active
To Action From
-- ------ ----
OpenSSH ALLOW Anywhere
Nginx HTTP ALLOW Anywhere
OpenSSH (v6) ALLOW Anywhere (v6)
Nginx HTTP (v6) ALLOW Anywhere (v6)Configuración de tu página web
Por defecto, NGINX muestra la página en /var/www/html, pero es mejor, sobretodo si queremos alojar más de una página, hacer un directorio para cada página web. Empecemos haciendo uno nuevo para tu página, sustituyendo TU_DOMINIO por el nombre de tu página:
sudo mkdir -p /var/www/TU_DOMINIO/htmlAhora asigna los permisos a tu usuario:
sudo chown -R $USER:$USER /var/www/TU_DOMINIO/html
sudo chmod -R 755 /var/www/TU_DOMINIOAhora crearemos una página web de prueba dentro de esta carpeta con el editor de texto que más te guste:
sudo nano /var/www/TU_DOMINIO/html/index.html<html>
<head>
<title>Tu propia pagina web!</title>
</head>
<body>
<h1>Bienvenido a tu propia pagina web!</h1>
<p>Tienes miles de posibilidades al alcance de la mano!</p>
</body>
</html>Ahora crearemos un archivo de configuración para tu página:
sudo nano /etc/nginx/nginx.confPega el siguiente bloque de texto, sustituyendo "TU_DOMINIO" por el nombre de tu página web. Por ejemplo «ardumaster.com»:
server {
listen 80 default_server;
listen [::]:80;
root /var/www/TU_DOMINIO/html;
index index.html index.htm index.nginx-debian.html;
server_name TU_DOMINIO www.TU_DOMINIO;
location / {
try_files $uri $uri/ =404;
}
}Hemos definido este servidor como servidor por defecto con la directriz default_server, por lo que debemos modificar el servidor «default» para quitarle esta misma directriz. Abrimos su configuración y eliminamos «default_server»:
sudo nano /etc/nginx/sites-available/default listen 80 default_server;
listen [::]:80 default_server;
listen 80;
listen [::]:80;
Ahora crearemos un enlace simbólico entre la carpeta /etc/nginx/sites-available/ y la carpeta /etc/nginx/sites-enabled/, que es la que lee NGINX al iniciarse:
sudo ln -s /etc/nginx/sites-available/TU_DOMINIO /etc/nginx/sites-enabled/Para evitar posibles problemas con varios nombres de servidores, editamos la configuración de NGINX para descomentar una línea:
ardumaster@little-monkey:~ $ sudo nano /etc/nginx/nginx.conf # server_names_hash_bucket_size 64;
server_names_hash_bucket_size 64;
Ahora nos aseguramos de que todo esté bien configurado y reiniciamos NGINX:
ardumaster@little-monkey:~ $ sudo nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
ardumaster@little-monkey:~ $ sudo systemctl restart nginxVisita la IP de tu servidor y deberías poder ver tu página web:
Comprar el dominio
En esta sección compraremos un dominio web, es decir, el nombre de nuestra página web tal y como aparece en la barra de búsqueda. Para ello recomiendo a Namecheap, ya que ofrece todos los recursos que pudiera necesitar un usuario básico y encuentro que la interfaz es amable e intuitiva. Claro está que puedes utilizar otro servicio para este paso y las instrucciones no deberían ser muy diferentes, así que si tienes tu nombre registrado con otro registrador, seras capaz de seguir este tutorial sin demasiados problemas.
Entramos en Namecheap y creamos una cuenta:
Nos dirigimos a la página de búsqueda de dominios e introducimos el nombre que nos gustaría para nuestra página web. Encontraremos varias ofertas dependiendo de la terminación. Lo más común es un dominio .com, pero, y sobretodo si nuestra página no va a tener una finalidad comercial (y por tanto no necesitamos que los usuarios acudan a un tipo de dominio que les es familiar), podemos escoger cualquier otro dominio, los hay muy económicos.
A partir de entonces, se trata de comprarlo como compraríamos cualquier otra cosa por internet. Lo configuraremos más adelante, ahora vamos a configurar el enrutador.
Configuración del enrutador
Procedemos con la configuración de puertos de tu enrutador. Cuando alguien quiera visitar tu página web, va a dirigirse a la dirección IP que está asignada a tu dominio (más adelante nos encargamos de actualizar tu IP), y entonces se dirigirá a tu enrutador. Lo que vamos a hacer ahora es decirle a tu enrutador que hacer cuando le lleguen este tipo de peticiones, a quien debe pasarle la conexión y en que puerto.
IP estática
Vamos a necesitar asegurarnos de que Raspberry Pi siempre se encuentra en la misma IP dentro de tu red local, por lo que vamos a definir una IP fija para tu Raspberry.
Hay varias maneras de hacer esto, pero nosotros lo configuraremos desde el enrutador, suele ser la manera más sencilla. Primero debemos averiguar la IP de nuestro enrutador. Si no la conocemos, podemos ejecutar el siguiente comando en la terminal:
ardumaster@little-monkey:~ $ ip r | grep default
default via 192.168.1.1 dev eth0 proto dhcp src 192.168.1.84 metric 202
Necesitamos otro dato de la Rapsberry, su dirección MAC, que podemos averiguar utilizando el siguiente comando y apuntándonos el código que aparece tras ether o wlan, dependiendo de la conexión que tengamos.
eth0: flags=4163<UP,BROADCAST,RUNNING,MULTICAST> mtu 1500
inet 192.168.1.84 netmask 255.255.255.0 broadcast 192.168.1.255
inet6 fe80::f380:fe0a:cc70:97fe prefixlen 64 scopeid 0x20<link>
ether b8:27:eb:49:2c:40 txqueuelen 1000 (Ethernet)
RX packets 2439 bytes 183910 (179.5 KiB)
RX errors 0 dropped 0 overruns 0 frame 0
TX packets 319 bytes 42127 (41.1 KiB)
TX errors 0 dropped 0 overruns 0 carrier 0 collisions 0
lo: flags=73<UP,LOOPBACK,RUNNING> mtu 65536
inet 127.0.0.1 netmask 255.0.0.0
inet6 ::1 prefixlen 128 scopeid 0x10<host>
loop txqueuelen 1000 (Local Loopback)
RX packets 21 bytes 2395 (2.3 KiB)
RX errors 0 dropped 0 overruns 0 frame 0
TX packets 21 bytes 2395 (2.3 KiB)
TX errors 0 dropped 0 overruns 0 carrier 0 collisions 0Utilizando un navegador web, nos dirigimos a esa IP, escribiendola directamente en la barra de búsqueda. Nos encontraremos con una pantalla de inicio de sesión. Si no has cambiado la contraseña, será fácil de encontrar ya sea siguiendo las instrucciones de esta pantalla, o buscando la contraseña por defecto de tu modelo particular por internet. Una vez tengas la contraseña, accede al menú del enrutador.
Una vez dentro, vamos a buscar los ajustes del servidor DHCP. No desesperes a la hora de buscar, es posible que se encuentren en otro menú tras «Opciones avanzadas». Una vez encontrado, seleccionamos «añadir entrada» e introducimos tanto la IP deseada (la que quieras siempre qu eno se esté usando ya) y la dirección MAC que obtuvimos previamente.
Reiniciamos la Raspberry Pi y comprobamos que tenemos la IP correcta:
ardumaster@little-monkey:~ $ sudo rebootardumaster@little-monkey:~ $ hostname -I
192.168.1.85Redirección de puertos
Ahora que tenemos una dirección fija par nuestra Raspberry, podemos redireccionar el tráfico que venga a nuestro enrutador por el puerto 80 (http). Para ello, simplemente accedemos al menú de puertos de nuestro enrutador y creamos una nueva regla con los siguientes valores:
- Nombre de la regla de puertos: Lo que queramos, que sea descriptivo, por ejemplo, nginx_http
- Dirección IP: La IP de nuestra Raspberry Pi
- Protocolo: TCP+UDP
- Abrir puerto / Rango externo (WAN): 80
- Abrir puerto / Rango interno (LAN): 80
DDClient para actualización automática de IP
Ya tenemos casi todo listo, solo hace falta un servicio que actualice nuestra IP para que Namecheap sepa cual es la dirección de nuestro servidor y pueda vincularla al nombre de nuestro dominio. Para esto vamos a utilizar DDClient.
Configuración de Namecheap para Dynamic DNS
Empezaremos por crear un nuevo registro de tipo A + Dynamic DNS Record. Para ello primero accederemos a nuestra cuenta en Namecheap y hacemos click en "Manage" al lado de nuestro dominio:
Ahora accedemos al área de DNS avanzado:
Y añadimos un nuevo registro de tipo A + Dynamic DNS Record con los siguientes campos:
- Type: A + Dynamic DNS Record
- Host: @
- Value: 127.01.01.01 (Da igual el valor, solo queremos comprobar más tarde que haya cambiado)
- TTL: Automatic
Guardamos el nuevo registro:
Por último, bajamos hasta encontrar «DYNAMIC DNS» y lo activamos mediante el botón. Copiamos la contraseña mostrada.
Esto es todo por parte de Namecheap, pero no cierres la página, después volveremos a ver si se ha actualizado la dirección IP.
Instalación de DDClient
Ahora instalaremos DDClient para que se comunique con Namecheap.
ardumaster@little-monkey:~ $ sudo apt install ddclient
Es posible que ddclient abra un diálogo preguntando por información. Lo que introduzcas no es muy relevante, puesto que vamos a editar el archivo de configuración manualmente, pero si quieres introducir los datos ahora, puedes encontrar los valores a introducir aquí.
Vamos a editar manualmente el archivo de configuración de ddclient:
ardumaster@little-monkey:~ $ sudo nano /etc/ddclient.confY lo configuramos tal que quede como el siguiente bloque, sustituyendo TU_DOMINIO por el nombre de tu dominio (por ejemplo, ardumaster.com) y TU_CONTRASEÑA por la contraseña de dynamic DNS de NAmecheap que copiamos antes. Atención, no quites las comillas, la contraseña debe quedar de esta manera: 'dfydf7dyh'.
use=web, web=dynamicdns.park-your-domain.com/getip
protocol=namecheap
server=dynamicdns.park-your-domain.com
login=TU_DOMINIO
password='TU_CONTRASEÑA'
@Ejecutamos una petición de ddclient:
ardumaster@little-monkey:~ $ sudo ddclient -query
Y si todo ha salido bien, deberíamos haber actualizado la IP de nuestro dominio en Namecheap. Vuelve a la página de Namecheap, refréscala y comprueba que el campo «Value» del registro A + Dynamic DNS Record se ha actualizado con tu IP.
¡Enhorabuena!
Puedes probar a introducir tu dominio desde fuera de tu red local y debería llevarte a tu nueva página web. Si no es el caso, no te preocupes, a veces los cambios de IP tardan unas horas en propagarse, pero si se ha actualizado en Namecheap, debería funcionar pasado un rato.
Ahora, ¿qué piensas hacer con tu nueva página?
