NPM (Node Package Manager) es un administrador de paquetes de paquetes Node.js. Hay un paquete de NPM llamado ‘shortid’ que se utiliza para crear identificadores únicos cortos no secuenciales aptos para direcciones URL. Las identificaciones únicas se crean mediante valores aleatorios criptográficamente fuertes, por eso es muy seguro. Tiene soporte para multiplataforma como Node, React Native, Chrome, Safari, Firefox, etc.
Comando para instalar:
npm install uuid
Sintaxis para importar el paquete en un archivo local
const {v4 : uuidv4} = require('uuid')
Sintaxis para crear una identificación única
const newId = uuidv4()
Hay algunos métodos definidos en los módulos shortid para crear identificaciones únicas y personalizar las identificaciones. algunos de los métodos se ilustran a continuación:
| Método | Trabajar |
| uuid.NIL | La string UUID nula (todo ceros) |
| uuid.parse() | Convierta la string UUID en una array de bytes |
| uuid.validar() | Pruebe una string para ver si es un UUID válido |
| uuid.v1() | Crear una versión 1 (marca de tiempo) UUID |
| uuid.v3() | Crear una versión 3 (espacio de nombres con MD5) UUID |
| uuid.v4() | Cree un UUID de versión 4 (aleatorio) |
| uuid.v5() | Crear una versión 5 (espacio de nombres con SHA-1) UUID |
| uuid.stringify() | Convierta una array de bytes en una string UUID |
Ejemplo 1: este ejemplo ilustra cómo generar y usar el paquete uuid para crear identificadores únicos.
filename-index.js: este archivo contiene toda la lógica para crear identificaciones únicas y adjuntarlas con la información del usuario y guardarlas en la base de datos.
javascript
const express = require('express')
const bodyParser = require('body-parser')
const {v4 : uuidv4} = require('uuid')
const formTemplet = require('./form')
const repo = require('./repository')
const app = express()
const port = process.env.PORT || 3000
// The body-parser middleware to parse form data
app.use(bodyParser.urlencoded({extended : true}))
// Get route to display HTML form
app.get('/', (req, res) => {
res.send(formTemplet({}))
})
// Post route to handle form submission logic and
app.post('/', (req, res) => {
// Fetching user inputs
const {name, email} = req.body
// Creating new unique id
const userId = uuidv4()
// Saving record to the database
// with attaching userid to each record
repo.create({
userId,
name,
email
})
res.send('Information submitted!')
})
// Server setup
app.listen(port, () => {
console.log(`Server start on port ${port}`)
})
filename – repository.js: este archivo contiene toda la lógica para crear una base de datos e interactuar con ella.
javascript
// Importing node.js file system module
const fs = require('fs')
class Repository {
constructor(filename) {
// Filename where data are going to store
if(!filename) {
throw new Error(
'Filename is required to create a datastore!')
}
this.filename = filename
try {
fs.accessSync(this.filename)
} catch(err) {
// If file not exist it is created
// with empty array
fs.writeFileSync(this.filename, '[]')
}
}
// Get all existing records
async getAll() {
return JSON.parse(
await fs.promises.readFile(this.filename, {
encoding : 'utf8'
})
)
}
// Create new record
async create(attrs){
// Fetch all existing records
const records = await this.getAll()
// All the existing records with new
// record push back to database
records.push(attrs)
await fs.promises.writeFile(
this.filename,
JSON.stringify(records, null, 2)
)
return attrs
}
}
// The 'datastore.json' file created at runtime
// and all the information provided via signup form
// store in this file in JSON format.
module.exports = new Repository('datastore.json')
nombre de archivo – form.js: este archivo contiene toda la lógica para representar el formulario.
javascript
module.exports = ({errors}) => {
return `
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href=
'https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.0/css/bulma.min.css'>
<style>
div.columns {
margin-top: 100px;
}
.button {
margin-top: 10px
}
</style>
</head>
<body>
<div class='container'>
<div class='columns is-centered'>
<div class='column is-5'>
<form action='/' method='POST'>
<div>
<div>
<label class='label'
id='str'>Name
</label>
</div>
<input class='input' type='text'
name='name' placeholder='Name'
for='name'>
</div>
<div>
<div>
<label class='label' id='email'>
Email
</label>
</div>
<input class='input' type='email'
name='email' placeholder='Email'
for='email'>
</div>
<div>
<button class='button is-info'>
Submit
</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
`
}
Producción:
Envío de información1
envío de información2
Base de datos:
Base de datos después de enviar la información
Ejemplo 2: Este ejemplo ilustra cómo usar los métodos uuid.parse() y uuid.stringify().
filename-index.js: este archivo contiene toda la lógica para crear identificaciones únicas y adjuntarlas con la información del usuario y guardarlas en la base de datos y también convertir la identificación en bytes analizados y los bytes analizados en una string de identificación.
javascript
const express = require('express')
const bodyParser = require('body-parser')
const {
v4 : uuidv4,
parse:uuidParse,
stringify : uuidStringify
} = require('uuid')
const formTemplet = require('./form')
const repo = require('./repository')
const app = express()
const port = process.env.PORT || 3000
// The body-parser middleware to parse form data
app.use(bodyParser.urlencoded({extended : true}))
// Get route to display HTML form
app.get('/', (req, res) => {
res.send(formTemplet({}))
})
// Post route to handle form submission logic and
app.post('/', (req, res) => {
// Fetching user inputs
const {name, email} = req.body
// Creating new unique id
const userId = uuidv4()
const parsedId = uuidParse(userId)
const stringfyId = uuidStringify(parsedId)
console.log(`parsedId : ${parsedId}\n`)
console.log(`StringifyId : ${stringfyId}\n`)
// Saving record to the database
// with attaching userid to each record
repo.create({
userId,
name,
email
})
res.send('Information submitted!')
})
// Server setup
app.listen(port, () => {
console.log(`Server start on port ${port}`)
})
filename – repository.js: este archivo contiene toda la lógica para crear una base de datos e interactuar con ella.
javascript
// Importing node.js file system module
const fs = require('fs')
class Repository {
constructor(filename) {
// Filename where datas are going to store
if(!filename) {
throw new Error(
'Filename is required to create a datastore!')
}
this.filename = filename
try {
fs.accessSync(this.filename)
} catch(err) {
// If file not exist it is created
// with empty array
fs.writeFileSync(this.filename, '[]')
}
}
// Get all existing records
async getAll() {
return JSON.parse(
await fs.promises.readFile(this.filename, {
encoding : 'utf8'
})
)
}
// Create new record
async create(attrs){
// Fetch all existing records
const records = await this.getAll()
// All the existing records with new
// record push back to database
records.push(attrs)
await fs.promises.writeFile(
this.filename,
JSON.stringify(records, null, 2)
)
return attrs
}
}
// The 'datastore.json' file created at runtime
// and all the information provided via signup form
// store in this file in JSON format.
module.exports = new Repository('datastore.json')
nombre de archivo – form.js: este archivo contiene toda la lógica para representar el formulario.
javascript
const getError = (errors, prop) => {
try {
return errors.mapped()[prop].msg
} catch (error) {
return ''
}
}
module.exports = ({errors}) => {
return `
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href=
'https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.0/css/bulma.min.css'>
<style>
div.columns {
margin-top: 100px;
}
.button {
margin-top: 10px
}
</style>
</head>
<body>
<div class='container'>
<div class='columns is-centered'>
<div class='column is-5'>
<form action='/' method='POST'>
<div>
<div>
<label class='label' id='str'>
Name
</label>
</div>
<input class='input' type='text'
name='name' placeholder='Name'
for='name'>
</div>
<div>
<div>
<label class='label' id='email'>
Email
</label>
</div>
<input class='input' type='email'
name='email' placeholder='Email'
for='email'>
</div>
<div>
<button class='button is-info'>
Submit
</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
`
}
Producción:
Envío de información
Identificación analizada y identificación de string
Base de datos:
Base de datos después de enviar la información
Nota: Hemos utilizado algunas clases de Bulma en el archivo form.js para diseñar nuestro contenido.
Publicación traducida automáticamente
Artículo escrito por hunter__js y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA