Platzi
Platzi

¡Invierte en ti y celebremos! Adquiere un plan Expert o Expert+ a precio especial.

Antes: $349
$259
Currency
Antes: $349
Ahorras: $90
COMIENZA AHORA
Termina en: 18D : 4H : 45M : 5S

Debes tener cuenta en Platzi

Para ver esta clase abierta debes iniciar sesión

Uso de plugins - Contenido estático5/35

Los plugins son módulos o archivos de Javascript creados generalmente por terceros, que le adicionan funcionalidades al framework base de Hapi.

Para implementar un plugin nuevo a nuestro proyecto, lo primero es importarlo en el index.js con la función requier() de NodeJS. Luego es necesario registrarlo con await server.register(plugin).

Por el momento, incluiremos en nuestro proyecto los plugins de Inert y Path

const inert = require('inert')
const path = require('path')

El plugin Inert extiende los métodos disponibles en el objeto h, y Path nos permite definir una ubicación relativa para todos los routes de nuestro proyecto, entre otras cosas.

Código: usando Inert para servir un directorio de archivos y
un index.html en el path ‘/’

Este video tiene un audio algo bajo…

This package has been deprecated
npm i inert

ahora es con npm i @hapi/inert

La forma de instalar hapi

npm install @hapi/hapi

Como tuve que instalar inert

npm i @hapi/inert

Y mi codigo

'use strict'

const Hapi = require('@hapi/hapi');
// SE IMPORTA EL PLUGING PARA SERVIR LOS ARCHIVOS ESTATICOS
// const inert = require('inert')
// SE IMPORTA path QUE PARTE DE NODE
const path = require('path')

// SE CREA EL SERVIDOR COMO OBJETO 
const server = Hapi.Server({
    // EL PUERTO SE ESTABLECE COMO PARAMETRO CON LA VARIALBLE DE ENTORNO PORT Y SI NO CON EL PUERTO 3000
    port: process.env.PORT || 3000,
    // CORRE EN EL LOCALHOST
    host: 'localhost',
    // SE DECLRAR LA VARIABLE/OBJETO PARA DECLRAR LA RUTA A LA CARPETA DE ARCHIVOS ESTATICOS
    routes: {
        files: {
            relativeTo: path.join(__dirname, 'public')
        }
    }
})

// DEFINICION DE FUNCIÓN PARA INICIALIZAR EL PROYECTO. INTENAMNETE HAY TAREAS ASINCRONAS
async function init() {
    try {
        // REGISTRAR LOS PLUGINS QUE HAPI VA A NECESITAR PARA SERVIR ARCHIVOS ESTATICOS
        await server.register(require('@hapi/inert'));

        // DEFINICIÓN DE RUTAS SE INDICA EL MÉTODO HTTP, URL Y CONTROLADOR/handler DE RUTA
        // SE DECLARAN DESPUÉS DEL PLUGIN YA QUE LAS RUTAS HACEN USO DEL MISOM PARA DEVOLVER ARCHIVOS ESTATICOS
        server.route({
            method: 'GET',
            path: '/home',
            handler: (req, h) => {
                // POR EL INERT SE TIENEN ACCESO AL METODO h.file()
                return h.file('index.html')
            }
        })
        // RUTA PARA SERVIR ARCHIVOS ESTÁTICOS ASOCIADOS (IMG/CSS/JS)
        server.route({
            method: 'GET',
            path: '/{param*}',
            handler: {
                directory: {
                    path: '.',
                    index: ['index.html']
                }
            }
        })
        // ES EL METODO QUE INICIA EL SERVIDOR
        await server.start()
    } catch (error) {
        console.error(error)
        // SALIR DE NODEJS CON UN CÓDIGO DE ERROR (1), 0 ES UN CODIGO DE EXITO
        process.exit(1)
    }

    console.log(`Servidor lanzado en: ${server.info.uri}`)
}

// SE INICIALIZA EL PROCESO
init()

Mi aporte en el código

'use strict'

// Requerir el modulo de hapi (Framework)
const Hapi = require('@hapi/hapi')
// Requerir el plugin de hapi para servir archivos estaticos
const inert = require('inert')
const path = require('path')

// Configurar el servidor de nuestra aplicación. En un contenedor (Docker) si marca error colocar 0.0.0.0 (todos)
const server = Hapi.server({
  port: process.env.PORT || 3000,
  host: 'localhost',
  // Definir propiedades generales para todas las rutas. (En este caso indico que las rutas que requieran archivos estáticos, se servirán desde la carpeta public)
  routes: {
    files: {
      relativeTo: path.join(__dirname, 'public')
    }
  }

})

// Definicion de función para inicializar el proyecto. Intenamnete hay tareas asincronas
async function init() {

  try {
    // Registrar los plugins que hapi va a necesitar (en este caso servir archivos estaticos)
    await server.register(inert)

    // Definición de rutas (indicar el método HTTP, URL y controlador de ruta)
    // Se declaran después del plugin ya que las rutas hacen uso del misom para devolver archivos estáticos
    server.route({
      method: 'GET',
      path: '/home',
      handler: (req, h) => {
        // El plugin de inert inyecta el metodo file en el objeto h para servir un archivo estático
        return h.file('index.html').code(200)
      }
    })

    // Ruta para servir archivos estáticos asociados (img/css/js)
    server.route({
      method: 'GET',
      path: '/{param*}',
      handler: {
        directory: {
          path: '.',
          redirectToSlash: true
        }
      }
    })

    // Arrancar el servidor de Hapi
    await server.start()
    console.log(`Servidor lanzado en: ${server.info.uri}`)
  } catch (error) {
    console.error(error)
    // Salir de nodeJS con un código de error (1), 0 es un código de exito
    process.exit(1)
  }
}

// Inicializar el proyecto
init();

Es importante mencionar que path es un módulo nativo de NodeJS, no es un plugin.

Me percate que el código del curso con respecto a Hapi ha cambiado bastante. Les comparto el código funcional.

'use strict'
const hapi = require('hapi')
const inert = require('inert')
const path = require('path')

const server = hapi.Server({
    port: process.env.PORT || 3000,
    host: 'localhost',
    routes: {
        files: {
            relativeTo: path.join(__dirname, 'public')
        }
    }
})

const initRoutes = async () =>{
    server.route({
        method: 'GET',
        path: '/home',
        handler: (req, h) => {
            return h.file('index.html')
        }
    })

    server.route({
        method: 'GET',
        path: '/{param*}',
        handler: {
            directory: {
                path: '.',
                index: ['index.html']
            }
        }
    })
}

const main = async () =>{
    try {
        await server.register(inert)
        await server.start()
        await initRoutes()
        
    } catch {
        console.error(error)
        console.exit(1)
    }finally{
        console.log(`Servidor lanzado en ${server.info.uri}`)
    }
}

main()

Hapi se actualizó, inert ya es parte de Hapi.
Se debe agregar
npm i -S @hapi/inert

la constante es =>
const inert = require(’@hapi/inert’);

En archivos y enlaces falta registrar inert

Cúal es la extensión de VSC para visualizar el tamaño de los archivos importados?

¯\_(ツ)_/¯

cool

A cambiado bastante todo, el código que a día de hoy me funciona

"use strict";

const Hapi = require("@hapi/hapi");
const inert = require("@hapi/inert");
const path = require("path");

const server = new Hapi.server({
  port: 3000,
  host: "localhost",
  routes: {
    files: {
      relativeTo: path.join(__dirname, "public"),
    },
  },
});

const provision = async () => {
  try {
    await server.register(inert);

    server.route({
      method: "GET",
      path: "/home",
      handler: (request, h) => {
        return h.file("index.html");
      },
    });

    server.route({
      method: "GET",
      path: "/{param*}",
      handler: {
        directory: {
          path: ".",
          redirectToSlash: true,
          index: true,
        },
      },
    });

    await server.register(inert);
    await server.start();
  } catch (error) {
    process.on("unhandledRejection", (err) => {
      console.log(err);
      process.exit(1);
    });
  }
  console.log("Server running on %s", server.info.uri);
};

provision();

El audio esta muy bajo

¡Hola a todos!

Como han notado la implementación de este curso ha quedado resagada en el versionamiento de paquetes, les comparto que estoy dejando mi boilerplate hasta este punto utilizando typescript y eslint (sintaxis de es6 y sirviendo archivos estáticos desde carpeta public), cualquier feedback es bienvenida.

pre-release-1.zip

y PR abiertos en el repo: hapi repo

mmm, creo que express si está comiendo le mercado a hapi

Para quienes les devuelve error de versión de hapi:
Plugin @hapi/inert requires hapi version >=19.0.0 but found 18.1.0.

  • Eliminar version de hapi anterior a 19.0.0 con npm unsintall --save hapi.
    -Instalar version actualizada npm install @hapi/hapi (aqui va en la version 20.0.2
    -Cambiar el require del módulo por const inert = requiere(’@hapiinert’)

Este video tiene un audio algo bajo…

This package has been deprecated
npm i inert

ahora es con npm i @hapi/inert

La forma de instalar hapi

npm install @hapi/hapi

Como tuve que instalar inert

npm i @hapi/inert

Y mi codigo

'use strict'

const Hapi = require('@hapi/hapi');
// SE IMPORTA EL PLUGING PARA SERVIR LOS ARCHIVOS ESTATICOS
// const inert = require('inert')
// SE IMPORTA path QUE PARTE DE NODE
const path = require('path')

// SE CREA EL SERVIDOR COMO OBJETO 
const server = Hapi.Server({
    // EL PUERTO SE ESTABLECE COMO PARAMETRO CON LA VARIALBLE DE ENTORNO PORT Y SI NO CON EL PUERTO 3000
    port: process.env.PORT || 3000,
    // CORRE EN EL LOCALHOST
    host: 'localhost',
    // SE DECLRAR LA VARIABLE/OBJETO PARA DECLRAR LA RUTA A LA CARPETA DE ARCHIVOS ESTATICOS
    routes: {
        files: {
            relativeTo: path.join(__dirname, 'public')
        }
    }
})

// DEFINICION DE FUNCIÓN PARA INICIALIZAR EL PROYECTO. INTENAMNETE HAY TAREAS ASINCRONAS
async function init() {
    try {
        // REGISTRAR LOS PLUGINS QUE HAPI VA A NECESITAR PARA SERVIR ARCHIVOS ESTATICOS
        await server.register(require('@hapi/inert'));

        // DEFINICIÓN DE RUTAS SE INDICA EL MÉTODO HTTP, URL Y CONTROLADOR/handler DE RUTA
        // SE DECLARAN DESPUÉS DEL PLUGIN YA QUE LAS RUTAS HACEN USO DEL MISOM PARA DEVOLVER ARCHIVOS ESTATICOS
        server.route({
            method: 'GET',
            path: '/home',
            handler: (req, h) => {
                // POR EL INERT SE TIENEN ACCESO AL METODO h.file()
                return h.file('index.html')
            }
        })
        // RUTA PARA SERVIR ARCHIVOS ESTÁTICOS ASOCIADOS (IMG/CSS/JS)
        server.route({
            method: 'GET',
            path: '/{param*}',
            handler: {
                directory: {
                    path: '.',
                    index: ['index.html']
                }
            }
        })
        // ES EL METODO QUE INICIA EL SERVIDOR
        await server.start()
    } catch (error) {
        console.error(error)
        // SALIR DE NODEJS CON UN CÓDIGO DE ERROR (1), 0 ES UN CODIGO DE EXITO
        process.exit(1)
    }

    console.log(`Servidor lanzado en: ${server.info.uri}`)
}

// SE INICIALIZA EL PROCESO
init()

Mi aporte en el código

'use strict'

// Requerir el modulo de hapi (Framework)
const Hapi = require('@hapi/hapi')
// Requerir el plugin de hapi para servir archivos estaticos
const inert = require('inert')
const path = require('path')

// Configurar el servidor de nuestra aplicación. En un contenedor (Docker) si marca error colocar 0.0.0.0 (todos)
const server = Hapi.server({
  port: process.env.PORT || 3000,
  host: 'localhost',
  // Definir propiedades generales para todas las rutas. (En este caso indico que las rutas que requieran archivos estáticos, se servirán desde la carpeta public)
  routes: {
    files: {
      relativeTo: path.join(__dirname, 'public')
    }
  }

})

// Definicion de función para inicializar el proyecto. Intenamnete hay tareas asincronas
async function init() {

  try {
    // Registrar los plugins que hapi va a necesitar (en este caso servir archivos estaticos)
    await server.register(inert)

    // Definición de rutas (indicar el método HTTP, URL y controlador de ruta)
    // Se declaran después del plugin ya que las rutas hacen uso del misom para devolver archivos estáticos
    server.route({
      method: 'GET',
      path: '/home',
      handler: (req, h) => {
        // El plugin de inert inyecta el metodo file en el objeto h para servir un archivo estático
        return h.file('index.html').code(200)
      }
    })

    // Ruta para servir archivos estáticos asociados (img/css/js)
    server.route({
      method: 'GET',
      path: '/{param*}',
      handler: {
        directory: {
          path: '.',
          redirectToSlash: true
        }
      }
    })

    // Arrancar el servidor de Hapi
    await server.start()
    console.log(`Servidor lanzado en: ${server.info.uri}`)
  } catch (error) {
    console.error(error)
    // Salir de nodeJS con un código de error (1), 0 es un código de exito
    process.exit(1)
  }
}

// Inicializar el proyecto
init();

Es importante mencionar que path es un módulo nativo de NodeJS, no es un plugin.

Me percate que el código del curso con respecto a Hapi ha cambiado bastante. Les comparto el código funcional.

'use strict'
const hapi = require('hapi')
const inert = require('inert')
const path = require('path')

const server = hapi.Server({
    port: process.env.PORT || 3000,
    host: 'localhost',
    routes: {
        files: {
            relativeTo: path.join(__dirname, 'public')
        }
    }
})

const initRoutes = async () =>{
    server.route({
        method: 'GET',
        path: '/home',
        handler: (req, h) => {
            return h.file('index.html')
        }
    })

    server.route({
        method: 'GET',
        path: '/{param*}',
        handler: {
            directory: {
                path: '.',
                index: ['index.html']
            }
        }
    })
}

const main = async () =>{
    try {
        await server.register(inert)
        await server.start()
        await initRoutes()
        
    } catch {
        console.error(error)
        console.exit(1)
    }finally{
        console.log(`Servidor lanzado en ${server.info.uri}`)
    }
}

main()

Hapi se actualizó, inert ya es parte de Hapi.
Se debe agregar
npm i -S @hapi/inert

la constante es =>
const inert = require(’@hapi/inert’);

En archivos y enlaces falta registrar inert

Cúal es la extensión de VSC para visualizar el tamaño de los archivos importados?

¯\_(ツ)_/¯

cool

A cambiado bastante todo, el código que a día de hoy me funciona

"use strict";

const Hapi = require("@hapi/hapi");
const inert = require("@hapi/inert");
const path = require("path");

const server = new Hapi.server({
  port: 3000,
  host: "localhost",
  routes: {
    files: {
      relativeTo: path.join(__dirname, "public"),
    },
  },
});

const provision = async () => {
  try {
    await server.register(inert);

    server.route({
      method: "GET",
      path: "/home",
      handler: (request, h) => {
        return h.file("index.html");
      },
    });

    server.route({
      method: "GET",
      path: "/{param*}",
      handler: {
        directory: {
          path: ".",
          redirectToSlash: true,
          index: true,
        },
      },
    });

    await server.register(inert);
    await server.start();
  } catch (error) {
    process.on("unhandledRejection", (err) => {
      console.log(err);
      process.exit(1);
    });
  }
  console.log("Server running on %s", server.info.uri);
};

provision();

El audio esta muy bajo

¡Hola a todos!

Como han notado la implementación de este curso ha quedado resagada en el versionamiento de paquetes, les comparto que estoy dejando mi boilerplate hasta este punto utilizando typescript y eslint (sintaxis de es6 y sirviendo archivos estáticos desde carpeta public), cualquier feedback es bienvenida.

pre-release-1.zip

y PR abiertos en el repo: hapi repo

mmm, creo que express si está comiendo le mercado a hapi

Para quienes les devuelve error de versión de hapi:
Plugin @hapi/inert requires hapi version >=19.0.0 but found 18.1.0.

  • Eliminar version de hapi anterior a 19.0.0 con npm unsintall --save hapi.
    -Instalar version actualizada npm install @hapi/hapi (aqui va en la version 20.0.2
    -Cambiar el require del módulo por const inert = requiere(’@hapiinert’)