Laravel 5.1 Beauty - Upload Manager

Creating an upload manager and interfacing with Amazon S3

In this chapter we’ll create an Upload Manager for the blog administration. First, the local file system will be used to store any uploaded files. Then, we’ll change the configuration to allow files to be stored on Amazon’s S3 cloud storage.

Configuring the File System

Let’s start with the configuration. Specifically, where will any files be stored? Create an upload directory within the project’s public directory. This way any files uploaded will be publicly accessible to the web.

The first thing changed was the root of the local storage. This changed to the public/uploads directory just created a moment ago. Then each of the configuration settings for the Amazon S3 storage driver changed to pull the values from the environment. This is so we can change them later in our .env file.

Adding a Helpers file

With projects in Laravel 5.1 it’s often handy to have a place to stash those little functions which don’t warrant a class on their own. A common practice is to place these functions in a helpers file.

Create a new file in the app directory named helpers.php. Populate this file with the code below.

Composer dumpauto

Now any functions in helpers.php will always be loaded and available to the l5beauty application.

Creating an Upload Manager Service

Now that the basic configuration is finished, let’s create a service class to manage our uploaded files.

Detecting Mime Types

Depending on the files being uploaded, we may want to have different actions occur. So it’d be nice to easily detect the Mime type of files.

PHP has the function mime_content_type(), but it’s deprecated. The PHP Fileinfo functions can detect the mime type, but in Windows a DLL must be copied to make fileinfo functions work. Let’s use a different solution.

Searching Packagist for “mime” shows a package by dflydev which looks good.

Four new methods here, which implement the new functionality of the Upload Manager.

Congratulations

You now have completed the Upload Manager for your blog’s administration
area. Everything should work. Give it a try. Upload a few files, create
a directory. Try uploading an image and you’ll see an option to preview
it.

Setting Up Your S3 Account

Using Amazon Simple Storage Service, also known as Amazon S3, is a cheap, fast and easy solution for storing files in The Cloud. With Laravel 5.1 it’s easy to configure the Upload Manager created in this chapter to save and retrieve files using Amazon S3.

Converting to Amazon S3 is optional. If you don’t want to do this, skip to the next chapter.

Here’s a quick startup list to set up S3 services.

1. Log in (or sign up) with Amazon

Go to amazon.com and log in if you have an existing account. If not, sign up for a new account..

2. Get a Web Services Account

Go to aws.amazon.com and sign up for a Amazon Web Services Account. You can sign up for a free account but you’ll still will need to enter a credit card.

3. Create a S3 Bucket

After you’ve created or logged into your AWS account, go to the Console and click on the S3 link. If you’ve never created an S3 bucket before you’ll be prompted to do so.

Figure 10.2 - AWS Create Bucket

Here I’m using l5beauty as the bucket name and taking the default region of Oregon it provides for me. (If you use a bucket name already in use Amazon will prompt you to pick a different name.)

If you have created a bucket before, it probably is still a good idea to create a new one.

Remember this Bucket and Region

You’ll need it later when we configure the application to use S3.

4. Create an Access Key

Click on your name at the top of the screen and then choose Security Credentials. This will present you with the Security Credentials screen. Click on the Access Keys area and you’ll see a screen similar to the one below.

Figure 10.2 - AWS Security Credentials

Click on the [Create New Access Key] button and you’ll see a screen that follows.

Important

Write down the values from the screen below before closing the window.
You may want to download the key file too. You won’t have access to
the secret key again.

Figure 10.3 - Create New Access Key

S3 Is Now Set Up

For now. Later we’ll make access public

Configuring L5Beauty to Use S3

Now that S3 services are set up, let’s configure the blog to use them.

Use the table below to get the code for the region you used when creating your bucket.

Test The Upload Manager

Point your browser to your l5beauty project’s administration area and go into uploads. Try creating directories, uploading files. Be sure to upload at least one image before moving on.

Also, verify from within your AWS Console that changes you make are reflected there.

Important

After uploading a file from the Upload Manager, view your bucket from the
AWS console, click on the file and check the Properties tab. There
will be a Link: value. Examine this URL and make any necessary changes
to the uploads.webpath property of config/blog.php.

Fixing Bucket Permissions

Everything should work great, from the administration area, but if a user visits your web page and you’re displaying an image you’ve stored on S3,
they won’t have permissions.

To fix this we’ll make everything on this bucket you created publicly viewable.

Go into the AWS Console and navigate to the bucket you just created. Then click on the Properties tab and click on the Permissions accordion to expand it. You should see a screen like the one below:

Figure 10.4 - Bucket Permissions

Click on the Add bucket policy link and when the Bucket Policy Editor appears click on the new policy link.

The following screen will appear.

Figure 10.5 - AWS Policy Generator

The Actions selected should be GetObject.

Click the [Add Statement] button and then the [Generate Policy] button and you’ll see a policy like the one below.

Copy this text and paste it into the previous screen’s Bucket Policy Editor box, click Save and you’re done.

Congratulations

Your Upload Manager should now work, allowing you to manage any files
uploaded for your block in the cloud.

Recap

In this chapter we configured the file system and built an upload manager that allowed us to upload files to the public area of the L5 Beauty application. We added a helpers.php file to the application as a place to store one-off functions.

A couple new packages were pulled in. One to detect mime-types and one required to access the Amazon S3 service.

Instructions were provided to set up and configure the Amazon S3 service. And finally, we configured our Upload Manager to use this.