استفاده از CDN در پروژه های لاراولی
ﺯﻣﺎﻥ ﻣﻄﺎﻟﻌﻪ: 3 دقیقه

استفاده از CDN در پروژه های لاراولی

همینطور که میدونید امروزه برای افزایش سرعت بارگذاری صفحات وبسایت و همچنین بهبود تجربه کاربری از CDN ها استفاده میشه. در این مقاله می خواهیم به بررسی استفاده از CDN در پروژه های لاراولی بپردازیم. پکیجی که معرفی می کنیم به نام Vinelab/cdn قابلیت آپلود asset ها (یا هر فایل public) رو در یک CDN و فقط با یک دستور artisan فراهم می کنه. و سپس امکان سوویچ کردن بین نسخه محلی و آنلاین از فایل ها رو فراهم میکنه.

پشتیبانی لاراول

  • برای لاراول 5.1 از آخرین نسخه استفاده کنید.
  • برای لاراول 4.2 از نسخه 1.0.1 استفاده کنید.

نکات برجسته

  • وب سرویس های آمازون - S3
  • دستور Artisan برای آپلود محتوا در CDN
  • یک Facade برای دسترسی به محتوای CDN

نصب

برای نصب پکیج با استفاده از کامپوزر کافیه دستور زیر رو استفاده کنید.

composer require vinelab/cdn:*

برای ادامه نصب باید کد زیر رو در فایل کانفیگ config/app.php داشته باشید :

'providers' => array(
     //...
     Vinelab\Cdn\CdnServiceProvider::class,
),

پیکربندی

تنظیمات کلیدهای دسترسی رو در فایل env. انجام بدید.

نکته : شما باید فایل env. رو در مسیر اصلی پروژه داشته باشید, تا از اطلاعات حساس نگهداری کنه.

AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=

برای داشتن این کدها باید از وب سرویس آمازون استفاده کنید :

وارد سایت http://aws.amazon.com شده و یک اکانت جدید بسازید (اونها به شما گزینه یک مدل حساب آزماشی خواهند داد). سپس وارد این صفحه بشید. در منوی اکانت سمت بالا کلیک کرده و در منوی پایین Security Credentials انتخاب کنید تا اطلاعات دو کلید دسترسی رو بهتون بده.

برای انتشار فایل پیکربندی از دستور زیر استفاده می کنیم :

php artisan vendor:publish vinelab/cdn

شما میتونید اون رو در config/cdn.php پیدا کنید.

Provider پیشفرض 

'default' => 'AwsS3',

پیکربندی CDN Provider

'aws' => [
    's3' => [
        'version'   => 'latest',
        'region'    => '',


        'buckets' => [
            'my-backup-bucket' => '*',
        ]
    ]
],

چندین bucket

'buckets' => [
    'my-default-bucket' => '*',

    // 'js-bucket' => ['public/js'],
    // 'css-bucket' => ['public/css'],
    // ...
]

فایل ها و دایرکتوری ها

فهرست دایرکتوری ها, فایل ها و الگوها برای انجام عملیات آپلود.

'include'    => [
    'directories'   => ['public/dist'],
    'extensions'    => ['.js', '.css', '.yxz'],
    'patterns'      => ['**/*.coffee'],
],

فهرست اونهایی که باید نادیده گرفته شوند :

'exclude'    => [
    'directories'   => ['public/uploads'],
    'files'         => [''],
    'extensions'    => ['.TODO', '.txt'],
    'patterns'      => ['src/*', '.idea/*'],
    'hidden'        => true, // ignore hidden files
],

تنظیم آدرس CDN URL :

'url' => 'https://s3.amazonaws.com',

تنظیم پارامترهای HTTP :

'http' => '['verify' => path-to-your-pem-certificate-file]',

برای بارگذاری asset های محلی برای تست یا هنگام توسعه, گزینه bypass رو true کنید :

'bypass' => true,

پشتیبانی Cloudfront

'cloudfront'    => [
    'use' => false,
    'cdn_url' => ''
],

سایر تنظیمات :

'acl'           => 'public-read',
'metadata'      => [ ],
'expires'       => gmdate("D, d M Y H:i:s T", strtotime("+5 years")),
'cache-control' => 'max-age=2628000',

اطلاعات بیشتر

نحوه استفاده

برای آپلود asset ها از دستور زیر استفاده کنید :

php artisan cdn:push

برای حذف asset ها از CDN دستور زیر رو بزنید :

php artisan cdn:empty

بارگذاری Asset ها 

برای این کار از Cdn و فراخوانی تابع ()Cdn::asset استفاده کنید.

نکته : asset ها مثل همان asset های لاراول کار میکنه که در مسیر public دنبالشون می گرده.

{{Cdn::asset('assets/js/main.js')}}        // example result: https://js-bucket.s3.amazonaws.com/public/assets/js/main.js

{{Cdn::asset('assets/css/style.css')}}        // example result: https://css-bucket.s3.amazonaws.com/public/assets/css/style.css

نکته : elixir هم به شکل سابق کار میکنه, فایل mainfest.json رو از پوشه ساخت انتخاب می کنه :

{{Cdn::elixir('assets/js/main.js')}}        // example result: https://js-bucket.s3.amazonaws.com/public/build/assets/js/main-85cafe36ff.js

{{Cdn::elixir('assets/css/style.css')}}        // example result: https://css-bucket.s3.amazonaws.com/public/build/assets/css/style-2d558139f2.css

برای استفاده از فایل خارج از پوشه public که در مسیر app هست باید از تابع زیر استفاده کرد :

{{Cdn::path('private/something/file.txt')}}        // example result: https://css-bucket.s3.amazonaws.com/private/something/file.txt

چه امتیازی برای این مقاله میدهید؟

خیلی بد
بد
متوسط
خوب
عالی
4 از 2 رای

دیدگاه و پرسش

برای ارسال دیدگاه لازم است وارد شده یا ثبت‌نام کنید ورود یا ثبت‌نام

در حال دریافت نظرات از سرور، لطفا منتظر بمانید

در حال دریافت نظرات از سرور، لطفا منتظر بمانید