Laravel 配置雙模板

Hoexhe發表於2019-03-01
Laravel

在開發過程中, 不時會遇到某些專案需要使用兩套模板

如PC端和Mobile端使用不同的模板檔案, 以達到最佳的使用者體驗

遇到這種情況我們應該如何配置Laravel的模板檔案呢?

1. 安裝whichbrowser/parser 傳送門: WhichBrowser/Parser-PHP

用於判斷PC或Mobile裝置, 按需載入不同的模板

composer require whichbrowser/parser

2. 使用artisan命令新建一個Middleware(中介軟體)

執行後會在app/Http/Middleware目錄生成中介軟體檔案

php artisan make:middleware Template

3. 編輯Template.php檔案

class Template
{
    protected $except = [];

    public function handle($request, Closure $next)
    {
        $result = new WhichBrowser\Parser(getallheaders());
        // 如果是桌面型別, 返回true
        $isDesktop = $result->isType('desktop');
        if ($isDesktop) {
            // 載入pc端的模板檔案
            $path = resource_path('views/pc/');
        } else {
            // 載入mobile端的模板檔案
            $path = resource_path('views/mobile/');
        }
        // 獲取檢視查詢器例項
        $view = app('view')->getFinder();
        // 重新定義檢視目錄
        $view->prependLocation($path);
        // 返回請求
        return $next($request);
    }
}

4. 最後註冊中介軟體

在app/Http/Kernel.php類中 按需註冊中介軟體

如註冊全域性中介軟體:

protected $middleware = [
    \App\Http\Middleware\Template::class,
];

搞定, 就可以根據不同的裝置載入不同的模板檔案了

在控制中只需這樣, 就可以根據不同的裝置來載入不同的模板了

return view('registration.index', $data);

如從PC裝置開啟網頁: 載入 /resources/views/pc/registration/index.blade.php 模板

如從移動裝置開啟網頁: 載入 /resources/views/mobile/registration/index.blade.php 模板

5.異常頁面的處理

異常處理傳送門 Laravel 的錯誤和日誌記錄

對於異常頁面，我們自然也需要雙模板進行展示

虛擬碼如下：

/**
 * Render an exception into an HTTP response.
 *
 * @param  \Illuminate\Http\Request  $request
 * @param  \Exception  $exception
 * @return \Illuminate\Http\Response
 */
public function render($request, Exception $exception)
{
    // 自定義HTTP錯誤頁面
    if ($exception instanceof HttpException) { // HTTP異常
        $status = $exception->getStatusCode();
        $message = $exception->getMessage();
        $result  =  new  WhichBrowser\Parser(getallheaders());
        $isDesktop = $result->isType('desktop');
        if ($isDesktop) {
            $dir = 'pc';
        } else {
            $dir = 'mobile';
        }

        $view = $dir . '.error.' . $status;
        if (view()->exists($view)) {
            return response()->view($view, ['message'=>$message], $status);
        }
    }
    return parent::render($request, $exception);
}

移動端的錯誤頁面：/resources/views/mobile/error/500.blade.php

PC端的錯誤頁面：/resources/views/pc/error/404.blade.php

搞定！

原文: Laravel 配置雙模板

本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章