Mientras buscaba cómo usar un subdominio, me di cuenta de que no solo el servidor de hosting lo debe hacer, sino también el servidor.
Primero, en el servicio de hosting, se registra un registro A o CNAME.
Luego, cuando la solicitud llega a la computadora, se transmite el puerto según la configuración del proxy inverso basada en el host del encabezado.
Primero escribo lo que aprendí sobre qué es un proxy y qué es un proxy inverso.
1. Proxy y Proxy Inverso
1. ¿Qué es un Proxy?
Proxy significa 'agente' o 'representante'.
Un proxy es un servidor que intermedia desde el punto de vista del usuario.
Cuando un usuario envía una solicitud al proxy, el proxy recibe el contenido en el destino real deseado por el usuario, lo transmite, y luego recibe la solicitud y la entrega al usuario.
En términos simples, es como el servicio de paquetería de una tienda de conveniencia.
El lugar al que realmente queremos enviar el paquete no es la tienda, sino la empresa de reparto.
Dejas el paquete en la tienda, y ellos lo entregan a la empresa de reparto y te devuelven la respuesta.
2. Proxy Inverso
Mientras que un proxy transmite solicitudes del cliente al servidor externo, un proxy inverso es un proceso de distribución dentro del servidor.
Si el proceso de envío a la empresa de reparto es el proxy, distribuir el paquete a cada hogar es el proxy inverso.
Se llama inverso porque el flujo es exactamente contrario.
Lo que quiero hacer es crear un subdominio y distribuir los puertos del servidor interno según el nombre del host en el encabezado de solicitud, por lo tanto, es un proxy inverso.
2. Proceso de Migración de nginx
El proceso fue más simple de lo que pensaba.
instalación de nginx -> eliminación de server.js y restauración de package.json de nextjs
-> cambio de nginx.conf -> inicio de nextjs, nginxHaciéndole preguntas a chatgpt sobre lo que no sabía, me llevó unos 15-20 minutos.
Al parecer, en la programación, aunque uno no sepa, lo mejor es intentarlo y comenzar.
3. Proceso Específico
1. Instalación de nginx
Siempre lo pienso, por esto uso la MacBook.
Si tienes homebrew instalado, podrás hacerlo de un tirón sin configuraciones molestas.
Y registras el servicio de inmediato.
brew install nginx
brew services start nginx2. Eliminación de server.js y restauración de package.json
La función del servidor que solía usar es la siguiente.
Esto simplemente se puede eliminar, pero por si acaso lo respaldé.
const https = require("https");
const http = require("http");
const { parse } = require("url");
const next = require("next");
const fs = require("fs");
const dev = process.env.NODE_ENV !== "production";
const PORT_HTTPS = 8000;
const PORT_HTTP = 3000;
const hostname = "localhost"; // or custom domain
const app = next({ dev, hostname, PORT: PORT_HTTPS });
const handle = app.getRequestHandler();
const httpsOptions = {
key: fs.readFileSync(
"privkey path",
"utf8"
), // read SSL cert key using "readFileSync"
cert: fs.readFileSync(
"fullchain path",
"utf8"
),
};
async function startServer() {
try {
await app.prepare();
const httpsServer = https.createServer(httpsOptions, (req, res) => {
const parsedUrl = parse(req.url, true);
handle(req, res, parsedUrl);
});
httpsServer.listen(PORT_HTTPS, () => {
console.log(`> Ready on https://${hostname}:${PORT_HTTPS}`);
});
const httpServer = http.createServer((req, res) => {
res.writeHead(301, { Location: `https://${req.headers.host}${req.url}` });
res.end();
})
httpServer.listen(PORT_HTTP, () => {
console.log(`> Ready on http://${hostname}:${PORT_HTTP}`);
})
} catch (err) {
console.error("Error starting the server:", err);
}
}
startServer();Y cambié la parte de script en package.json de la siguiente manera.
"scripts": {
"dev": "nodemon server.js",
"build": "next build",
"start": "NODE_ENV=production nodemon server.js",
"lint": "next lint",
},"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint",
},Después de esto, si ejecutas sudo yarn dev, el servidor se ejecutará automáticamente en http://localhost:3000.
Ahora que la preparación básica está lista, juguemos con nginx.
3. Cambio de nginx.conf
chatgpt me dijo que editara el archivo conf con nano de la siguiente manera, pero no pude soportarlo porque era frustrante.
nano /opt/homebrew/etc/nginx/nginx.confMe metí en esa ruta y abrí el archivo con vscode.
Y borré todo el contenido interno y copié el contenido que chatgpt me proporcionó.
Por favor, consulta los comentarios para obtener más detalles.
# Número de procesos se ajusta automáticamente. Si es baja carga, 1 está bien.
# En eventos, la cantidad de conexiones es el número de conexiones a procesar.
# Número de procesos * Número de conexiones = Número de conexiones que se pueden procesar simultáneamente.
worker_processes auto;
events {
worker_connections 1024;
}
# Gestiona las solicitudes http. También puede manejar tipos como mail{}, stream{}, etc.
http {
# Asigna automáticamente el tipo MIME según la extensión del contenido.
include mime.types;
# Configuración de host virtual para definir ajustes de servidor
include /opt/homebrew/etc/nginx/sites-enabled/*;
# Tipo MIME predeterminado si no se conoce la configuración.
default_type application/octet-stream;
# Mejora el rendimiento de la transferencia de archivos utilizando características del núcleo del sistema operativo. Usado para servir archivos estáticos.
sendfile on;
# Tiempo de mantenimiento de la conexión del cliente. Reduce conexiones TCP innecesarias para mejorar el rendimiento del servidor.
keepalive_timeout 65;
# Aquí se colocan los bloques del servidor.
# El primero redirige las solicitudes http a https
server {
listen 80;
server_name www.earthscience.kr earthscience.kr;
return 301 https://$host$request_uri;
}
# El segundo incluye las solicitudes https y la ubicación de los certificados ssl y claves.
server {
listen 443 ssl;
server_name www.earthscience.kr earthscience.kr;
ssl_certificate /etc/letsencrypt/live/www.earthscience.kr/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/www.earthscience.kr/privkey.pem;
location / {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
}4. Inicio de nextjs, nginx
Ahora simplemente construye el archivo en nextjs -> inicia el servidor y luego inicia nginx.
sudo yarn build
sudo yarn start
sudo nginx # si aún no has iniciado nginx4. Reflexiones
Cuando escuché por primera vez sobre nginx, no comencé debido a la presión de tener que aprender otro lenguaje.
Pero resulta que es mucho más fácil configurarlo que el server.js.
Parece que en programación, uno debería simplemente comenzar a trabajar en ello.
Pero...
Buscando memes, me encontré con caddy, que dicen que es mejor que nginx.
Parece que otra aventura está a punto de comenzar.
댓글을 불러오는 중...