如何使用 express-validator 验证输入字段中的输入是否具有 base64 编码字符串？

在 HTML 表单中，我们经常需要验证不同的类型。验证现有电子邮件，验证密码长度，验证确认密码，验证仅允许整数输入，这些是验证的一些示例。如果在某个输入字段中只允许使用 base64 编码字符串，即不允许任何其他形式的字符串不构成 base64 编码字符串。我们还可以使用 express-validator 中间件验证这些输入字段以仅接受 base 64 编码的字符串。

安装 express-validator 的命令：

npm install express-validator

使用 express-validator 实现逻辑的步骤：

• 安装 express-validator 中间件。
• 创建一个validator.js 文件来编码所有的验证逻辑。
• 通过 validateInputField: check(input field name) 验证输入并在验证 isBase64() 上使用 ' 链接。 '
• 使用路由中的验证名称（validateInputField）作为验证数组的中间件。
• 从 express-validator 中解构 'validationResult'函数以使用它来查找任何错误。
• 如果发生错误，则重定向到传递错误信息的同一页面。
• 如果错误列表为空，则授予用户后续请求的访问权限。

注意：这里我们使用本地或自定义数据库来实现逻辑，可以按照相同的步骤在MongoDB或MySql等常规数据库中实现逻辑。

示例：此示例说明如何验证输入字段以仅接受 base 64 编码字符串。

文件名 - index.js

javascript

const express = require('express')
const bodyParser = require('body-parser')
const {validationResult} = require('express-validator')
const repo = require('./repository')
const { validateBase64Data } = require('./validator')
const formTemplet = require('./form')
 
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(
  '/data',
  [validateBase64Data],
  async (req, res) => {
    const errors = validationResult(req)
    if(!errors.isEmpty()){
      return res.send(formTemplet({errors}))
    }
    const {name, base64data} = req.body
    await repo.create({
      name,
      base64data
    })
 
 res.send('
Base 64 data decoded and '
  + 'Stored successfully in the database
')
})
 
// Server setup
app.listen(port, () => {
  console.log(`Server start on port ${port}`)
})

文件名——repository.js：该文件包含创建本地数据库并与之交互的所有逻辑。

javascript

// Importing node.js file system module
const fs = require('fs')
const { base64decode } = require('nodejs-base64');
 
class Repository {
  constructor(filename) {
 
    // The 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()
    // Decode base64 encoded data
    const data = base64decode(attrs.base64data)
    // New record
    const record = {
      name:attrs.name,
      data
    }
 
    // All the existing records with
    // new record push back to database
    records.push(record)
    await fs.promises.writeFile(
      this.filename,
      JSON.stringify(records, null, 2)  
    )
    return record
  }
}
 
// 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')

文件名 - form.js：此文件包含显示 HTML 表单的逻辑。

javascript

const getError = (errors, prop) => {
  try {
    return errors.mapped()[prop].msg
  } catch (error) {
    return ''
  }
}
 
module.exports = ({errors}) => {
  return `
    
    
      
        
        
      
      
        

          

            

              
           
                

                  

                    
                      Name
                    
                  
                  
                
                

                  

                    
                      Base 64 data
                    
                  
                  
                  

                    ${getError(errors, 'base64data')}
                  
 
 
                
                

                  
                    Submit
                   
                
              
            
          
        
      
      
  `
}

文件名 - validator.js：此文件包含所有验证逻辑（验证输入字段以仅接受基本编码的 64字符串的逻辑）

javascript

const {check} = require('express-validator')
const repo = require('./repository')
module.exports = {
   
  validateBase64Data : check('base64data')
    // To delete leading and trailing space
    .trim()
    // Validate input field to accept only base32 string
    .isBase64()
    // Custom message
    .withMessage('Must be a Base 64 encoded string')
}

文件名 - package.json

包.json 文件

数据库：

数据库

将普通字符串转换为 base 64字符串的在线网站：

将普通字符串转换为 base64字符串的在线网站（以显示我们为哪个字符串提供 base64 输入）

输出：

尝试使用无效的 base64字符串提交

尝试使用无效的 base 64字符串提交时的响应

尝试使用有效的 base64字符串提交

尝试使用有效的 base 64字符串提交时的响应

表单提交成功后的数据库：

表单提交成功后的数据库

注意：我们在 signup.js 文件中使用了一些 Bulma 类（CSS 框架）来设计内容。