揭秘laravel-blade-javascript责任链模式6个Transformer协作转换任意值到JavaScript【免费下载链接】laravel-blade-javascriptA Blade directive to export variables to JavaScript项目地址: https://gitcode.com/gh_mirrors/la/laravel-blade-javascriptlaravel-blade-javascript是一个 Laravel 扩展包它提供了一个javascriptBlade 指令让你可以把 PHP 变量一键导出到 JavaScript中在模板里写一行javascript(key, value)页面渲染后浏览器里就能直接用key这个变量。那么问题来了PHP 里什么都有——字符串、布尔、数组、对象、null……它是怎么把任意值安全地变成合法的 JavaScript 的答案就是本项目源码中隐藏的责任链模式Chain of Responsibility先看效果一个指令打通 PHP 与 JavaScript安装只需一条命令composer require spatie/laravel-blade-javascript在 Blade 模板中使用javascript(key, value)页面最终输出scriptwindow[key] value;/script如果不想污染全局还可以在配置文件 config/blade-javascript.php 里设置namespace把变量收进独立命名空间避免命名冲突。责任链模式是什么为什么这里需要它想象一支流水线一个值进入后依次询问每个转换器——你能处理它吗谁能处理谁来接手其他人继续待命。这就是责任链模式每个节点只负责一种职责单一职责代码短小好测试新增类型只需加一个节点不用改老代码开闭原则拒绝处理时自动传递给下一个链路末段统一兜底报错laravel-blade-javascript 正是这样实现的。所有转换器都实现同一个接口定义在 src/Transformers/Transformer.phpinterface Transformer { public function canTransform($value): bool; // 我能处理吗 public function transform($value); // 那就交给我 }两个方法、一种契约六个实现。Renderer责任链的总调度整条链的发起者是 src/Renderer.php。它在构造函数里注册了 6 个转换器按固定顺序组成链条protected $transformers [ ArrayTransformer::class, BooleanTransformer::class, NullTransformer::class, NumericTransformer::class, ObjectTransformer::class, StringTransformer::class, ];真正的传递发生在getTransformer()方法中——逐个询问命中即返回public function getTransformer($value): Transformer { foreach ($this-getAllTransformers() as $transformer) { if ($transformer-canTransform($value)) { return $transformer; } } throw Untransformable::noTransformerFound($value); }一句话概括先问遍所有人没人能处理就抛Untransformable异常错误信息直接告诉你是哪个值没被转换排查体验极佳。6个Transformer逐一揭秘各自认领什么任务1️⃣ ArrayTransformer —— 数组与集合的翻译官位于 src/Transformers/ArrayTransformer.php用is_array()认领所有数组直接json_encode()变成 JSON 对象。这是 PHP 数组与 JS 对象之间最自然的桥梁。2️⃣ BooleanTransformer —— 布尔值的类型对齐器位于 src/Transformers/BooleanTransformer.php。PHP 的true/false恰好和 JavaScript 同名所以转换几乎零成本保证前端拿到的是布尔类型而不是字符串1。3️⃣ NullTransformer —— 空值的兜底者位于 src/Transformers/NullTransformer.php。PHP 的null对应 JS 的null短小精悍但必不可少——否则一个 null 值就可能整条链跑空。4️⃣ NumericTransformer —— 数字的直通车位于 src/Transformers/NumericTransformer.php同时认领int和float。它做的几乎是原样放行因为数字在两种语言里的字面量写法一致是整条链里最轻松的节点。5️⃣ ObjectTransformer —— 对象的多策略专家位于 src/Transformers/ObjectTransformer.php是链中最有想法的一位按优先级尝试三种策略对象有toJson()方法直接调用兼容 Laravel Eloquent 模型对象实现了JsonSerializable或是StdClass交给json_encode()有__toString()方法退化成字符串处理三条路都走不通才会抛出Untransformable异常。6️⃣ StringTransformer —— 字符串的安全卫士位于 src/Transformers/StringTransformer.php。它不只是加引号内部还有一套转义逻辑对反斜杠、单引号、换行以及做替换——最后一步防止用户输入提前闭合 script 标签规避 XSS 注入风险。这是整条链里安全含金量最高的节点。协作全景图一个值如何走完责任链顺序Transformer认领条件转换结果示例1ArrayTransformeris_array(){id:1}2BooleanTransformeris_bool()true/false3NullTransformeris_null()null4NumericTransformeris_int()或is_float()42/3.145ObjectTransformeris_object()JSON 或转义字符串6StringTransformeris_string()hello以javascript(user, $user)为例一次完整的调用流程Renderer 接收参数normalizeArguments()把多种传参写法键值对、数组、Collection统一成key value结构逐个变量走链buildVariableInitialization()为每个值调用optimizeValueForJavaScript()责任链选人getTransformer()按上表顺序询问 6 位 Transformer命中者完成转换拼装输出所有window[key] 值;语句拼接到模板视图 src/Renderer.php 中渲染成script标签如果 6 位都拒绝异常定义在 src/Exceptions/Untransformable.php 中的Untransformable会被抛出开发阶段立刻暴露问题而不是让前端拿到一段坏代码。想扩展加一个节点就行这正是责任链模式的红利假设你想支持DateTime类型只需新建一个类实现Transformer接口canTransform判断instanceof DateTimetransform输出new Date(...)再把它加进 Renderer 的$transformers数组——原有 6 个转换器一行都不用动。测试代码 tests/BladeTest.php 展示了如何断言转换结果可作为扩展时的参考。小结小而美的设计教科书laravel-blade-javascript 只有十几行核心代码却把责任链模式用得恰到好处✅单一职责6 个 Transformer一个文件一类值各司其职✅统一契约canTransformtransform两方法接口扩展零门槛✅链路兜底Untransformable异常让无法转换变得可见、可排查✅安全内建StringTransformer 的转义逻辑堵住 XSS 后路如果你正在写自己的 Laravel 包不妨看看 src/ 下的这份源码——它证明了经典设计模式哪怕用在一个小工具里也能让代码结构清晰得令人愉悦 ✨【免费下载链接】laravel-blade-javascriptA Blade directive to export variables to JavaScript项目地址: https://gitcode.com/gh_mirrors/la/laravel-blade-javascript创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考