【Laravel实战】一行代码压缩blade模板里的HTML，减少40%的文件大小

 我使用的云服务器，流量按量付费，约1元/G，以前的业务写代码的时候总是很小心的尽量减少代码的使用，随着业务复杂度的增加了很多的代码，如果边改业务边优化代码，不易读反而影响了上线的进度，所以为了兼顾速度与功能，我想到了将代码进行自动压缩。

一、代码

创建一个中间件：/app/Http/Middleware/CompressHTML.php

<?php

namespace AppHttpMiddleware;

/**
 * Copyright (C) 2022 : Chongqing Enzu Technology Co., LTD
 * LICENSE : http://www.apache.org/licenses/LICENSE-2.0
 * [KwokCMS] Ver 1.0 (C) 2024: Mr.Kwok
 * FilePath: /app/Http/Middleware/CompressHTML.php
 * Created Time: 2024-01-7 14:16:03
 * Last Edit Time: 2024-01-7 11:53:27
 * Description: 压缩HTML中间件
 */

use Closure;

class CompressHtml
{
    public function handle($request, Closure $next)
    {
        $response = $next($request);
        if ($response->isSuccessful()) {
            $contentTypes = $response->headers->get('Content-Type');
            if (is_string($contentTypes) && strpos($contentTypes, 'text/html') !== false) {
                $response->setContent(preg_replace("/[nrt]*|s{2,}/is", '', $response->getContent()));
            }
        }
        return $response;
    }
}

注册中间件：app/Http/Kernel.php

protected $middlewareAliases = [
        //... 其它中间件
        'htmlcompress' => AppHttpMiddlewareCompressHtml::class, //压缩HTML
    ];

在路由里应用中间件：app/Providers/RouteServiceProvider.php

Route::middleware(['web','htmlcompress'])->group(base_path('routes/web.php'));

如果你想要做后台去控制是否开启中件间，可以直接在总控制器里去注册：app/Http/Controllers/Controller.php

    //初始化类
    public function __construct()
    {
        $this->app = settings(); //获取到网站配置信息
        $this->data = []; //初始化
        if ($this->app['htmlcompress']) {
            $this->middleware('htmlcompress'); //开启HTML压缩
        }
    }

二、注意事项

本方法比较简单，没有太多的判断，所以在写前端的时候应该注意不要使用下面这样的注释：

<script>
    $(function () {
        // 移出单词最后一行的下线(换行被删除后下面所有的代码将全部被注释掉)
        var itemsPerRow = 3;
        var screenWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
        $('.row .col-md-4').each(function (index) {
            var rowNumber = Math.floor(index / itemsPerRow) + 1;
            if (rowNumber === Math.ceil($('.row .col-md-4').length / itemsPerRow)&&screenWidth>430) {
                $(this).removeClass('border-bottom');
            }
        });
     });
</script>

正确的注释写法：

<script>
    $(function () {
        /* 正确的注释换行后不会影响其它代码 */        
     });
</script>

除非注明，网络人的文章均为原创，转载请以链接形式标明本文地址：https://www.55mx.com/post/242