With the recent release of Laravel 5.5 and Laravel Horizon, the Laravel ecosystem has reached a whole new level of maturity. In effect, Laravel has become a great option for PHP projects. the whole new level.
Cloudways facilitates Laravel developers in launching their projects without worrying about the hassles of server management. In addition, with the optimized stack that emphasizes performance, Cloudways ensures great speed for Laravel applications.
Continuing the tradition, Cloudways has recently launched a Content Delivery System (CDN) to help the users provide a better UX their Laravel projects. In this article, I will demonstrate the process of implementing Laravel CDN.
For the purpose of this tutorial, I assume that you already have a Cloudways server with the Laravel application installed on it. If this is not the case, here is where to sign up for a free trial account.
Let’s get started.
Map Your domain
Now that you have the server and application, simply use the Cloudways Platform to map your domain because this is an essential requirement for using the CloudwaysCDN.
To do that, login to the Cloudways Platform. Go to the Applications tab and click on Domain Management. Add your primary domain here and click Save.
Enable SSL Certificate on the App
CloudwaysCDN requires a secure connection for data transmission. Therefore, you need to enable an SSL certificate on your application. You can easily do it for free at the Cloudways Platform. Simply Click SSL Certificates in the Application Management options. Insert your domain URL and create the certificate.
Enable CloudwaysCDN for the Laravel Application
Now that your domain is mapped, click the CloudwaysCDN option available at the end of the Application Management options. When you click the tab, you will see the CDN configuration screen. Here you will find the URL of the application to be inserted in the WEBSITE URL field and click the Create button.
Next, you will get the newly generated URL for the Laravel application:
Few things to note here:
- You can view the bandwidth usage on this screen.
- You can purge old content from the CDN cache using the Purge button.
- You can remove your subscription anytime.
Get Ready for Core Web Vitals Update
Ebook to Speed Up Your Website Before You Start Losing Traffic.
Thank You
Your list is on it’s Way to Your Inbox.
Integrate CloudwaysCDN with Laravel Application
To implement Laravel CDN, create a global function which will be used throughout the application. For this, add a helpers.php file in the app folder. Place the following code in the file:
function cdn( $asset ){
//Check if we added cdn's to the config file
if( !Config::get('app.cdn') )
return asset( $asset );
//Get file name & cdn's
$cdns = Config::get('app.cdn');
$assetName = basename( $asset );
//remove any query string for matching
$assetName = explode("?", $assetName);
$assetName = $assetName[0];
//Find the correct cdn to use
foreach( $cdns as $cdn => $types ) {
if( preg_match('/^.*\.(' . $types . ')$/i', $assetName) )
return cdnPath($cdn, $asset);
}
//If we couldnt match a cdn, use the last in the list.
end($cdns);
return cdnPath( key( $cdns ) , $asset);
}
function cdnPath($cdn, $asset) {
return "//" . rtrim($cdn, "/") . "/" . ltrim( $asset, "/");
}
This is a very simple function which checks if there are any CDN domains listed in the config file. If there are no CDN domains, it will just return the standard asset() function. Otherwise, it will use the CDN domain.
Now to use this function, edit the composer.json file and add the following code snippet:
"autoload": {
"classmap": [
.....
],
"files": [
"app/helpers.php"
]
},
Now, tell Composer to dump its autoloader. Type the following command in the terminal.
composer dump-autoload
Now, open app/config/app.php or the config file for your environment. Add your CDN domain into the app.php, just like the below example:
'cdn' => [ "77728-356013-raikfcquaxqncofqfm.stackpathdns.com" => "css|js|eot|woff|ttf,jpg|jpeg|png|gif|svg" ],
That’s it. Everything is setup. Simply replace the asset() function in the views with the new cdn() function. For example, I have used the following code to link the bootstrap.css file
<link rel="stylesheet" href="{{ cdn('css/bootstrap.css') }}">
Example of using CDN for image:
<img class="img-responsive" src="{{cdn('images/iphone.png')}}" alt="iphone">
Replace all the asset() functions with cdn() in your files and improve the performance of your application dramatically.
Conclusion
Cloudways have partnered with StackPath (formerly known as MaxCDN), and provide one-click activation for the CloudwaysCDN. Note that, for a single website, the monthly subscription costs $1 per 25GB of bandwidth.
Also, I would like to give a shoutout to Jason Agnew for giving awesome tips for integrating CloudwaysCDN with Laravel applications.
Shahzeb Ahmed
Shahzeb is a Digital Marketer with a Software Engineering background, works as a Community Manager — PHP Community at Cloudways. He is growth ambitious and aims to learn & share information about PHP & Laravel Development through practice and experimentation. He loves to travel and explore new ideas whenever he finds time. Get in touch with him at [email protected]
