Phalcon資源文件管理（Assets Management）

時間 2019-12-09

標籤 phalcon 資源文件管理 assets management 简体版

原文原文鏈接

資源文件管理（Assets Management）¶

Phalcon\Assets是一個讓開發人員管理靜態資源的組件，如管理css，javascript等。javascript

Phalcon\Assets\Manager 存在於DI容器中，因此咱們可以在服務容器存在的不論什麼地方使用它來加入/管理資源。php

加入資源（Adding Resources）¶

Assets支持兩個內置的資源管理器：css和javascripts.咱們可以依據需要建立其餘的資源。資源管理器內部保存了兩類資源集合一爲 javascript還有一爲css.css

咱們可以很easy的向這兩個集合里加入資源。例如如下：html

 
    <?php

class IndexController extends Phalcon\Mvc\Controller
{
    public function index()
    {

        //加入本地css資源
        $this->assets
            ->addCss('css/style.css')
            ->addCss('css/index.css');

        //加入本地js資源
        $this->assets
            ->addJs('js/jquery.js')
            ->addJs('js/bootstrap.min.js');

    }
}
 
   

而後咱們可以在視圖中輸出資源：java

<html>
    <head>
        <title>Some amazing website</title>
        <?php $this->assets->outputCss() ?>
    </head>
    <body>

        <!-- ... -->

        <?php $this->assets->outputJs() ?
> </body> <html> jquery

Volt語法：web

 
    <html>
    <head>
        <title>Some amazing website</title>
          {{ assets.outputCss() }}
    </head>
    <body>

        <!-- ... -->

          {{ assets.outputJs() }}
    </body>
<html>
 
   

本地與遠程資源（Local/Remote resources）¶

本地資源是同一應用中的資源，這些資源存在於應用的根文件夾中。 Phalcon\Mvc\Url 用來生成本地的url. 遠程資源便是一種存在於CDN或其餘遠程server上的資源。比方常常使用的jquery, bootstrap等資源。bootstrap

 
    <?php

public function indexAction()
{

    //加入遠程及本地資源
    $this->assets
        ->addCss('//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css', true )
        ->addCss('css/style.css', false );
}
 
   

集合（Collections）¶

集合便是把一同類的資源放在一些。資源管理器隱含的建立了兩個集合：css和js. 固然咱們可以建立其餘的集合以歸類其餘的資源。這樣咱們可以很是easy的在視圖裏顯示：api

<?
php //html頭部的js資源 $this->assets ->collection('header') ->addJs('js/jquery.js') ->addJs('js/bootstrap.min.js'); //html尾部的js資源 $this->assets ->collection('footer') ->addJs('js/jquery.js') ->addJs('js/bootstrap.min.js'); 瀏覽器

而後在視圖中例如如下使用：

<html>
    <head>
        <title>Some amazing website</title>
        <?
php $this->assets->outputJs('header') ?
> </head> <body> <!-- ... --> <?php $this->assets->outputJs('footer') ?> </body> <html>

Volt語法：

 
    <html>
    <head>
        <title>Some amazing website</title>
          {{ assets.outputCss('header') }}
    </head>
    <body>

        <!-- ... -->

          {{ assets.outputJs('footer') }}
    </body>
<html>
 
   

前綴（Prefixes）¶

集合可以加入前綴，這可以實現很easy的更換server：

<?
php $scripts = $this->assets->collection('footer'); if ($config->environment == 'development') { $scripts->setPrefix('/'); } else { $scripts->setPrefix('http:://cdn.example.com/'); } $scripts->addJs('js/jquery.js') ->addJs('js/bootstrap.min.js');

咱們也可以使用鏈式語法，例如如下：

<?
php $scripts = $assets ->collection('header') ->setPrefix('http://cdn.example.com/') ->setLocal(false) ->addJs('js/jquery.js') ->addJs('js/bootstrap.min.js');

壓縮與過濾（Minification/Filtering）¶

Phalcon\Assets提供了內置的js及css壓縮工具。

開發人員可以設定資源管理器以肯定對哪些資源進行壓縮啊些資源不進行壓縮。

除了上面這些以外咱們還可以使用Douglas Crockford書寫的Jsmin壓縮工具，及Ryan Day提供的CSSMin來對js及css文件進行壓縮. 如下的樣例中展現了怎樣使用集合對資源文件進行壓縮：

 
    <?php

$manager

    //這些javascript資源位於html文件的底部
    ->collection('jsFooter')

    //終於輸出名
    ->setTargetPath('final.js')

    //使用此uri顯示資源
    ->setTargetUri('production/final.js')

    //加入遠程資源但不壓縮
    ->addJs('code.jquery.com/jquery-1.10.0.min.js', true, false)

    //這些資源必須要壓縮
    ->addJs('common-functions.js')
    ->addJs('page-functions.js')

    //把這些資源放入一個文件內
    ->join(true)

    //使用內置的JsMin過濾器
    ->addFilter(new Phalcon\Assets\Filters\Jsmin())

    //使用本身定義過濾器
    ->addFilter(new MyApp\Assets\Filters\LicenseStamper());
 
   

開始部分咱們經過資源管理器取得了一個命名的集合，集合中可以包括javascript或css資源但不能同一時候包括兩個。一些資源可能位於遠程的server上這上結資源咱們可以經過http取得。爲了提升性能建議把遠程的資源取到本地來。以下降載入遠程資源的開銷。

 
    <?php

//這些Javscript文件放在頁面的底端
$js = $manager->collection('jsFooter');

如上面，addJs方法用來加入資源到集合中，第二個參數指示了資源是否爲外部的，第三個參數指示是否需要壓縮資源：

 
    <?php

//加入遠程資源但不壓縮
$js->addJs('code.jquery.com/jquery-1.10.0.min.js', true, false);

// These are local resources that must be filtered
//加入本地資源並壓縮
$js->addJs('common-functions.js');
$js->addJs('page-functions.js');

過濾器被註冊到集合內。咱們可以註冊我個過濾器，資源內容被過濾的順序和過濾器註冊的順序是同樣的。

 
    <?php

//使用內置的Jsmin過濾器
$js->addFilter(new Phalcon\Assets\Filters\Jsmin());

//使用本身定義的過濾器
$js->addFilter(new MyApp\Assets\Filters\LicenseStamper());

注意：不管是內置的仍是本身定義的過濾器對集合來講他們都是透明的。最後一步用來肯定所有寫到同一個文件裏仍是分開保存。

假設要讓集合中所有的文件合成一個文件僅僅需要使用join函數：

 
    <?php

//全並文件
$js->join(true);

//設置終於輸出文件
$js->setTargetPath('public/production/final.js');

//使用此uri引用js
$js->setTargetUri('production/final.js');

假設資源寫入同一文件，則咱們需要定義使用哪個文件來保存要寫入的資源數據。及使用一個ur來展現資源。這兩個設置可以使用setTargetPath() 和setTargetUri()兩個函數來配置。

內置過濾器（Built-In Filters）¶

Phalcon內置了兩個過濾器以分別實現對js及css的壓縮，由於兩者是使用c實現的故極大的下降了性能上的開銷：

過濾器	說明
Phalcon\Assets\Filters\Jsmin	壓縮Javascript文件即去除掉javascript解釋器/編譯器忽略的一些字符
Phalcon\Assets\Filters\Cssmin	壓縮css文件即去除掉瀏覽器在渲染css時不需要的一些字符

本身定義過濾器（Custom Filters）¶

除了使用Phalcon內置的過濾器外，開發人員還可以建立本身的過濾器。

這樣咱們就可以使用YUI_, Sass, Closure,等。

 
     <?php

use Phalcon\Assets\FilterInterface;

/**
 * 使用YUI過濾css內容
 * @param string $contents
 * @return string
 */
class CssYUICompressor implements FilterInterface
{

    protected $_options;

    /**
     * CssYUICompressor 構造函數
     *
     * @param array $options
     */
    public function __construct($options)
    {
        $this->_options = $options;
    }

    /**
     * 運行過濾
     * @param string $contents
     * @return string
     */
    public function filter($contents)
    {

        //保存字符呂內容到暫時文件裏
        file_put_contents('temp/my-temp-1.css', $contents);

        system(
            $this->_options['java-bin'] .
            ' -jar ' .
            $this->_options['yui'] .
            ' --type css '.
            'temp/my-temp-file-1.css ' .
            $this->_options['extra-options'] .
            ' -o temp/my-temp-file-2.css'
        );

        //返回文件內容
        return file_get_contents("temp/my-temp-file-2.css");
    }
}
 
    

使用方法:

 
     <?php

//取css集合
$css = $this->assets->get('head');

//加入/啓用YUI壓縮器
$css->addFilter(new CssYUICompressor(array(
     'java-bin' => '/usr/local/bin/java',
     'yui' => '/some/path/yuicompressor-x.y.z.jar',
     'extra-options' => '--charset utf8'
)));
 
    

本身定義輸出（Custom Output）¶

OutputJs及outputCss方法可以根據不一樣的資源類來建立需要的html代碼。

咱們可以重寫這種方法或是手動的輸出這些資源方法例如如下：

 
    <?php

foreach ($this->assets->collection('js') as $resource) {
    echo \Phalcon\Tag::javascriptInclude($resource->getPath());
}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。