如何在Node/Express客户端中正确渲染服务端错误？

看起来你已经搭好了初步的Express服务框架，我来帮你补全并优化这个带Schema验证的书签添加功能，确保不符合规则的请求能返回清晰的错误提示。

第一步：定义带验证规则的Bookmark Schema #

首先用Mongoose定义Bookmark模型，给url字段加上必填和格式验证，满足你需要的错误提示需求：

const mongoose = require('mongoose');

const BookmarkSchema = new mongoose.Schema({
  url: {
    type: String,
    // 必填验证，自定义错误提示
    required: [true, 'Please provide a url'],
    // URL格式正则验证，自定义错误提示
    match: [
      /^(https?:\/\/)?([\da-z.-]+)\.([a-z.]{2,6})([/\w .-]*)*\/?$/,
      'Please enter a valid URL'
    ]
  },
  tags: {
    type: [String],
    default: [] // 标签默认设为空数组
  }
});

module.exports = mongoose.model('Bookmark', BookmarkSchema);

第二步：完善POST路由与错误处理 #

接下来补全你的POST路由，加入异步处理和验证错误捕获，确保错误提示能正确返回给客户端：

const express = require('express');
const Bookmark = require('./models/Bookmark'); // 替换成你的Schema文件实际路径
const app = express();

// 解析JSON格式的请求体
app.use(express.json());

app.post('/api/bookmarks', async (req, res) => {
  try {
    const { url, tags } = req.body;
    // 调用Mongoose的create方法创建书签，自动触发Schema验证
    const newBookmark = await Bookmark.create({ url, tags });
    
    // 创建成功，返回201状态码（资源创建成功的标准状态码）和书签数据
    res.status(201).json({
      success: true,
      data: newBookmark
    });
  } catch (error) {
    // 捕获Mongoose的验证错误
    if (error.name === 'ValidationError') {
      // 提取所有字段的验证错误信息，整理成数组返回
      const errorMessages = Object.values(error.errors).map(err => err.message);
      return res.status(400).json({
        success: false,
        errors: errorMessages
      });
    }
    
    // 处理其他服务器内部错误
    res.status(500).json({
      success: false,
      error: 'Server encountered an unexpected error'
    });
  }
});

// 启动服务
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}`);
});

关键细节说明 #

• 验证触发逻辑：当调用Bookmark.create()时，Mongoose会自动检查请求数据是否符合Schema定义的规则，不符合则抛出ValidationError。
• 错误信息处理：Mongoose的ValidationError对象中，每个字段的错误会存在error.errors里，我们通过Object.values()和map()提取出友好的提示文本返回给客户端。
• 状态码规范：
  • 201：资源创建成功的标准状态码
  • 400：客户端请求数据不符合规则的状态码
  • 500：服务器内部错误的状态码

测试示例 #

• 当请求体缺少url字段时，返回的响应：

  {
    "success": false,
    "errors": ["Please provide a url"]
  }
  

• 当url格式无效（比如my-invalid-url）时，返回的响应：

  {
    "success": false,
    "errors": ["Please enter a valid URL"]
  }
  

内容的提问来源于stack exchange，提问作者doctopus