Confieso que aunque hay mucha información sobre ReactJS, el montar un servidor con certificado Letsencrypt fue cuesta arriba. La ayuda disponible en los foros por lo general hablan de poner en producción la apliación pero no con estas características.

La solución la conseguí para mi proyecto, un chat con el aspecto de whatsapp publicado en github, pero con sus particularidades.

Para saber como lo hice en el backend del chat, desde luego en node.js, pueder ver cómo instalar node.js con certificado Letsencrypt en mi artículo.

También pueder ver cómo instalar Letsencrypt en Centos.

Sin más que decir, lo que hice fue buscar dentro de node_module/webpack-dev-server/lib/Server.js y coloqué antes de la condición:

if (semver.gte(process.version, '10.0.0'))

la siguientes líneas de código con la información de la ubicación del certificado:

// Certificate
      const privateKey = fs.readFileSync('/etc/letsencrypt/live/sudominio.com/privkey.pem', 'utf8');
      const certificate = fs.readFileSync('/etc/letsencrypt/live/sudominio.com/cert.pem', 'utf8');
      const ca = fs.readFileSync('/etc/letsencrypt/live/sudominio.com/chain.pem', 'utf8');

      const credentials = {
      	key: privateKey,
      	cert: certificate,
      	ca: ca
      };

y cambié:

this.listeningApp = require('spdy').createServer(options.https, app);

por:

this.listeningApp = https.createServer(credentials, app);

Una vez finalizado, npm start y listo.

Actualización

Para utilizar Letsencrypt con CRT:

const privateKey = fs.readFileSync('/etc/pki/tls/private//services.workplace.com.co.key', 'utf8');
const certificate = fs.readFileSync('/etc/pki/tls/certs/services.workplace.com.co.cert', 'utf8');
const ca = fs.readFileSync('/etc/pki/tls/certs/services.workplace.com.co.bundle', 'utf8');

2 comentarios en “Certificado Letsencrypt + React JS (Actualizado)

  1. Hola buenas , tengo el proyecto de React JS en un Servidor y he modificado lo que has dicho más arriba , tras hacer el react script start y abrir mi navegador , precediendo la URL de HTTPS no me funciona.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *