应使用正则 /^#([0-9a-fa-f]{3}|[0-9a-fa-f]{6}|[0-9a-fa-f]{8})$/ 验证 hex 颜色,配合 required|string|filled 确保非空,入库前统一转小写。

验证 color 字段是否为合法 HEX 颜色值
直接在 Laravel 的请求验证规则里加 regex,别用自定义 Rule 类——除非你要复用到十几个地方。HEX 颜色本质是字符串匹配问题,正则够用且清晰。
常见错误是只写 ^#[0-9a-fA-F]{6}$,结果前端传了 #fff 或 #ffffffaa(带 alpha)就挂掉;或者没加 ^ 和 $,导致 "abc#123456xyz" 也被放过。
-
^#[0-9a-fA-F]{3}$:匹配 3 位简写(如#f00) -
^#[0-9a-fA-F]{6}$:匹配标准 6 位(如#ff0000) -
^#[0-9a-fA-F]{8}$:匹配含 alpha 的 8 位(如#ff000080) - 合并写法:
^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$
示例验证规则:
public function rules()
{
return [
'color' => ['required', 'string', 'regex:/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/'],
];
}
Laravel 10+ 中用 HexColor 自定义验证规则更干净
如果项目里多处要验颜色,或者你希望错误提示更明确(比如显示“颜色格式不合法,支持 #RGB、#RRGGBB 或 #RRGGBBAA”),那就抽成自定义 Rule。但注意:Laravel 10+ 的 make:rule 生成的是闭包式 Rule,别手写类然后漏掉 passes() 方法签名。
容易踩的坑是没处理大小写或开头的 # 缺失——比如用户输 ff0000 而不是 #ff0000,这时候该报错还是自动补?建议严格校验,不自动修正,避免掩盖前端传参错误。
- 运行
php artisan make:rule HexColor - 在
passes()里用preg_match('/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/', $value) - 别在
message()里硬编码中文,用翻译文件更稳妥
前端传空字符串或 null 时,required 不够用
很多人以为加了 required 就万事大吉,但前端 JS 可能传 ""、null 或 undefined,而 Laravel 默认对空字符串仍会进入 regex 校验——结果 "" 显然不匹配 ^#...,报错信息却是“格式错误”,而不是“不能为空”。这会让调试变绕。
正确做法是组合使用 required|string|filled:filled 会拒绝 null、""、0、false 等“空值”,比单纯 required 更贴近语义。
-
filled是关键:它确保字段存在且非空(非 falsy 值) - 别把
string放在filled前面,否则null会先被转成字符串再校验,行为不可控 - 如果允许字段缺失(即非必填),但一旦传了就必须合法,就去掉
required,只留filled|regex:...
数据库存 HEX 值要不要转大写或小写?
存的时候统一转小写(strtolower($color))最省事。MySQL 对字符串大小写不敏感,PostgreSQL 默认敏感,但颜色值本身大小写无意义,标准化后能避免重复、简化查询(比如去重或索引查找)。
别在验证规则里做转换——验证层只管对错,不该改数据。应该在 FormRequest 的 validated() 之后、入库前处理,或者用 Eloquent 的 mutator:
protected function setColorAttribute($value)
{
$this->attributes['color'] = strtolower($value);
}
注意:如果你用了 casts 把字段定义为 string,mutator 依然生效;但若同时用了 attribute casting(如 color: string),mutator 优先级更高,不会冲突。
真正容易被忽略的是:前端 CSS 通常接受大小写混合的 HEX,但你后台一旦存了大小写混杂的值,后续 API 返回给前端时,可能因缓存、CDN 或日志输出造成不一致——所以入库前归一化,比到处修 display 层靠谱得多。
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!











