javascript - 如何使用服务器端验证生成客户端验证？

Question

在我的例子中，当服务器端 @Valid 失败时，响应包含每个目标输入的错误消息。所以我不必编写客户端验证。但我想事先使用客户端验证最小化请求。但是我很懒，我发现自己编写了两次基本相同的验证代码。

有没有办法使用服务器端验证来生成客户端验证？

Answer 1

如果您在服务器端使用注释进行验证，您可以基于它们生成客户端验证。

例子:

public class MyObject{
   @Size(min=2, max=30, message ="Invalid size")
   private String name;
   //getters & setters
}

如果您使用 jQuery 验证插件，您可以在每个字段上添加目标验证。有关详细信息，请参阅引用资料: https://jqueryvalidation.org/reference/

您可以获取所有字段并查看其注释:

Field[] fields = MyObject.class.getDeclaredFields();

并从他们那里获取目标注释:

Map<String, Set<String>> validationsRules = new HashMap<>();
Field field = fields[0]; // here you should iterate over all fields
Size size = field.getAnnotation(Size.class);
Set<String> dataAttributes = new HashSet<>();
dataAttributes.add("data-rule-minlength=" + size.min());
dataAttributes.add("data-rule-maxlength=" + size.max());
dataAttributes.add("data-msg-minlength=" + size.message());
dataAttributes.add("data-msg-maxlength=" + size.message());
validationsRules.put(field.getName(), dataAttributes);

验证规则必须添加到 View 并附加到每个字段。你的最终 html 将是这样的:

<input name="name" data-rule-minlength=2 data-rule-maxlength=30 data-msg-minlength="Invalid size" data-msg-maxlength="Invalid size"/>