HOSTING – Static / Dynamic Sites + Media + Files – ON AWS

Cloudfront – is there a sword.com setup?




GITHUB – WORDPRESS AWS TEMPLATES w/permissions/security/all settings ready to deploy

https://github.com/aws-samples/aws-refarch-wordpress


Cloudfront – Extended Configuration Info – AWS DOC

Level 1 Article

https://aws.amazon.com/cloudfront/getting-started/

Level 2 Article (applicable info)

Cloudfront conifg explanation – full article on aws (click here) | Adding security to aws (click here)

https://aws.amazon.com/blogs/startups/how-to-accelerate-your-wordpress-site-with-amazon-cloudfront/

Extra – Bitnami configuration cdn / is there an ubuntu?

SNIPPET FROM LEVEL 2 ARTICLE

Distributions, Origins, and Behaviors

First, I’ll offer a brief recap on some terminology to make sure we are on the same page. A CloudFront configuration with a DNS endpoint is called a distribution. All of the configuration settings for a website may be configured with a single distribution, though there may be content with different attributes such as images, which are cacheable, and dynamically generated content, customized to a viewer, which should not be cached.  WordPress separates content into the folder structure described in the table below.  We can configure CloudFront with appropriate settings to serve each class of content through cache behaviors, which allow request URLs, typically grouped by file extension or path prefix, to have appropriate cache configuration applied.

Even a relatively simple website may serve content from separate locations. CloudFront refers to these separate locations as origins. An origin can be either an Amazon S3 bucket or an HTTP endpoint. Your HTTP servers can be hosted on AWS or any Internet-facing HTTP system. In the diagram above S3 and the WordPress servers would be configured as separate origins in your distribution settings.

I’ll next describe the three main steps to configuring CloudFront:

  1. Creating a distribution
  2. Defining your origin(s)
  3. Configuring cache behaviors

Origins

More BEHAVIORS

Adding CloudFront Origins and Behaviors
Adding CloudFront Origins and Behaviors


HOSTING DYNAMIC – WORDPRESS – SITES ON AWS – OFFICIAL DOC

https://aws.amazon.com/websites/


https://www.vizteck.com/post/how-to-host-your-wordpress-website-on-amazon-ec2-and-s3

WRITTEN 2017
How to Host your WordPress Website on Amazon EC2 and S3

You can enjoy reliable, fast, and protected website (against any type of data loss) by hosting your website on cloud.

In this article, I will let you know the basic procedure to host your WordPress website on Amazon S3 and EC2.

Hosting on Amazon S3

Hosting your images on Amazon s3 is a great option because you can stop worrying about backing up your images as S3 keeps multiple copies of your files and access to the images is very fast. It also reduces the load on your server of images.

Hosting on Amazon EC2

Amazon EC2 helps you in making resizable memory and compute capacity online (on cloud).  Hosting on aws gives you an awesome plug and play option for your server hard disks, capacity and computing power.

Why Hosting on AWS EC2 and S3 is Beneficial?

  1. You can enjoy flexible pricing structure for each service do you want to avail.

  2. The configuration dashboard is so easy to manage. So that you can setup if you have little experience with Amazon S3 and EC2.

  3. You get scalable hosting.

  4. Now, you have highly available website.

  5. You will feel ease in loading high potential resources (content pulling) for your website.

Process to Host your WordPress Website

Step-1:

Sign up for the Amazon Account. You will get the Access Key and API Key for this

Add it into your WordPress plugin to access it in the Amazon directory

define(AWS_ACCESS_KEY_ID,*****************
<strong><em>);
define(AWS_SECRET_ACCESS_KEY,</em>
</strong>*************************************);

Step-2:

You will get the Amazon Web Services Management Console.

Step-3:

Select the services which you are looking forward.

Step-4:

On service tab ( select EC2 and S3).

Step-5: Steps for S3 

Click to S3 first

  1. Create a bucket on S3: The S3 bucket is actually a container like the structure of your website, that’s the bucket for your S3 asset for your WordPress website.

  1. Now, you have to set up your WordPress website to communicate with the S3.

  2. From the “Static Website Hosting” option, enable website hosting on your index page (that would probably the first landing page of your website).

  1. Enable website hosting indexed document and error file in case of any error.

  1. Upload all the files that you want to be in your S3 bucket. Your bucket is accessible privately. You can check out your bucket URL from the side bar of S3. dashboard.

  1. If you have developed a bucket earlier then, select the required bucket and hit upload to push your relevant content in the S3 Bucket.

  2. After File upload, it will be pulled from that directory from Amazon S3 bucket, where it was once saved.

  3. After your file upload, you can make these file public to make it accessible via its AWS S3 bucket URL (in my case it’s: www.yourwebsite.com.s3_website-eu-west-1.amazonaws.com). Now, the images and content can be accessed from your S3 bucket now.

  1. You can add the bucket privacy policy from the “Permission” link on the left panel of the S3 bucket.  Click on ‘Add Bucket Policy’ to add a code for it. Now you can access all the content of your website publically.

{

 “Version”: “2012-10-17”,

 “Statement”: [

{

“Sid”: “PublicReadGetObject”,

“Effect”: “Allow”,

“Principal”: {

“AWS”: “*”

},

“Action”: “s3:GetObject”,

“Resource”: “arn:aws:s3:::YOUR-BUCKET-NAME-HERE/*”

}

 ]

}

  1. Check for the URL of your website. Here is your website from Amazon S3 bucket.

Step-6: Steps for EC2 

Now, for launching your EC2 Instance, follow the procedure as below:

  1. Just login to your AWS console.

  2. Find the EC2 under compute list under Amazon Web Services dashboard.

  1. To configure your virtual machine, create and launch an EC2 instance.

  1. After creating, configure your instance by going through the configuration wizard.

  2. In the configuration setup, choose AWS marketplace that has WordPress installed. If not, then go to the left navigation panel and select AWS marketplace.

  3. In the provided list click on the WordPress and install it. Ongoing through its steps, review it.

  1. On going through the next step, proceed it with or without key (as you want it).

  2. Your instance is launched now. You can activate any subdomain or domain in it.

  3. The Public IP is associated with the website, which you will be using for your website.

  4. Your website is now launched, and all the assets are loaded via AWS. To make it accessible, with your very own URL, edit your “.htaccess” file.  

  5. Run your EC2 instance, load your files and access it through its server now.

Step-7: Steps to Do on WordPress Dashboard End

Once you done with creating the EC2 Instance for your website and making the S3 Bucket for your content, you now need to link it into the WordPress dashboard end.

For this, the necessary procedure is :

Install AWS Plugins

  1. Go to the plugin area, and Click on “Add Plugin” .

  2. Search for plugin named “ Amazon Web Services” which will Houses the Amazon Web Services (AWS) PHP libraries and manages access keys. Required by other AWS plugins.

  3. Once installed, download another plugin for S3. It is advised to install the plugin named “Amazon S3 and CloudFlare”.

  4. Activate both the plugins

  5. Once activated, on the left panel find AWS, click Access Key, it will ask you to add the Access API key and Secret Access Key  for your AWS, just add it and Save Changes.

  1. Now, Go for S3 and CloudFront,  and browse for the Existing Bucket, or Create New one , depending upon the thing you want to get.

  1. You will see all the content in your existing bucket. The next screen will be

Set the path from where it will sync your images or content. Check for any other option, if it suits you. Now, all the things are ready for work and your assets will launch from the S3 bucket, when you add into your WordPress post or pages. It will automatically sync and load from AWS.

Conclusion

Vizteck is striving to adopt the latest practices for making data secure and reliable on the server and client end. All of the projects that we deliver to our clients are managed without any data loss. For this we adopt the Amazon Web Services.


HOSTING STATIC WEBSITES ON AMAZON S3 – OFFICIAL DOC

https://docs.aws.amazon.com/AmazonS3/latest/dev/WebsiteHosting.html


GUIDE 1:Cloudfront CDN in our AWS account that is integrated to a free AWS S3 storage bucket.
Afterwards we’ll install a WordPress plugin authored by Delicious Brains that integrates the CDN to our WordPress site.
We’ll also install a second plugin from imagify.io


GUIDE 2:S3 Offload Media


GUIDE 3:S3 Bucket to Wordpress


STATIC MEDIA ASSETS

https://www.elegantthemes.com/blog/tips-tricks/how-to-use-amazon-s3-and-cloudfront-with-wordpress

In discussions of speeding up your website, you may have heard the term cloud computing. At its most basic level, cloud storage simply refers to uploading your site’s files, such as images, stylesheets, and other assets, to a remote server. A content delivery network, or CDN, connects to cloud storage and serves files to users across a wide network of fast servers all over the globe, to ensure the quickest download times and connection. In the cloud computing world, it is going to be hard to find a solution better than AWS (Amazon Web Services), specifically their S3 and Cloudfront services. With a quick set up, and the help of a few plugins, it’s possible to use these services to speed up your site and backup all of your files regularly, at a very low cost. But first, a quick rundown of AWS.

How AWS Works

Amazon has a whole suite of cloud services under its AWS umbrella, for long term and short term data storage, full server stacks, and content distribution. It is even possible to run a WordPress site using only AWS, though this requires some advanced knowledge of server infrastructure.

The best way to get started with AWS is to enhance and speed up your WordPress site by using two of Amazon’s web services, S3 and Cloudfront. S3 is a service which allows you to upload files to a remote server that Amazon runs, and then serve them up to users across a distributed network, making download speeds of larger files (like media files) a lot quicker. Cloudfront is an optional extension of S3, and is a fully fledged CDN (Content Distribution Network). A CDN takes your sites static assets, and caches them on servers around the world. When a user downloads that asset from your site, it is pulled from the server that is geographically the closest, and assets are downloaded as quickly as possible.

Standard storage on S3
Standard storage on S3

Standard storage on S3

Pricing for both S3 and Cloudfront is based entirely on use, and costs are kept fairly low. For a medium sized blog with a good amount of traffic, you might spend $2 – $5 / month for both services. However, this will vary based on how many assets your site has, and what kind of traffic it receives. You can use the AWS calculator to estimate your costs. The service itself works by exposing the servers you purchase to an easy to use API, which you can use to programmatically upload and access files. So if you’d like to use S3 and Cloudfront with WordPress, the first step is to set up that API.

Setting Up AWS

The first thing to do is actually create an AWS account. You can do so by visiting the signup page and using your Amazon credentials. You will be automatically signed up for all available services, though you only pay for what you use.

We want to start by creating an S3 bucket where we will store files from our WordPress site. Click on the S3 button in the main Amazon dashboard. This will bring you to the blank S3 console, with an option to “Create a Bucket”. Click this to create your cloud storage space.

Amazon S3 Create New
Amazon S3 Create New

Creating a new bucket

You will need to give it a name, using alphanumeric characters and no spaces, that is unique across all users of S3. That means if any other user has already chosen a bucket name, it is off limits for all users. When choosing a name, try and pick something unique to your site, like your domain name.

For now, we are just going to leave our bucket empty and move on to Cloudfront. Cloudfront is not required for some of the solutions we will discuss below, but it can speed things up quite a bit for your users. It will also cost a bit more each month.

To set up Cloundfront, return to the main AWS dashboard and click on the Cloudfront service link. On the next screen, click the “Create Distribution” button. From the next screen, select “Get Started” under the Web option. The next step will ask for an Origin Domain where it should serve files from. Here, you can select the S3 bucket you just created to sync the services up. There are lots of other options here, but most can be left at their default or blank. Finally, click “Create Distribution” to actually start the service.

With everything set up, the last thing you need to do is get access to your API keys. These will allow WordPress services to connect with your AWS cloud without needing to authenticate every time they do. To get your API keys, you will need to create an IAM user that has access to your AWS account. First, go to the IAM console and click on the “Groups” tab.

Amazon IAM Console
Amazon IAM Console

Make sure to set permissions to Administrator

You will need to create a new group and user to grant access to. Click “Create New Group”, give your group a name, and then select “Administrator Access” in Policy Template step, and create your group. Next, click on the “Users” tab and click “Create New User”. Once again, give your user a name, and make sure the “Generate an access key for each user” box is selected. Once you’ve created the users, you will be provided an access key and secret access key. Make sure to store these somewhere, or click “Download Credentials” to download them to your computer. The last step is to connect your user with your Group by click on the user that you just created and selecting the “Add User to Groups” option, and selecting the group you created in the first step. This will ensure that the access keys associated with this user have access to your account.

What You Can Do With AWS

Once you’ve set up your Amazon account, S3 bucket, and Cloudfront distribution, you can begin to connect your WordPress site with the cloud. The most common use case for this is to automatically upload media files to S3 and serve them to users using Cloudfront. However, you can also use AWS to make routine backups of your site, store digital downloads, or stream videos. We will go over a few plugins that can help you do all of this.

W3 Total Cache and AWS

W3 Total Cache is a popular caching and performance plugin for WordPress. It can do a lot for your site automatically, such as minifying and combining stylesheets and scripts, caching static versions of your pages, and speeding up loading time across your entire site. It is in use by a lot of sites, and there is a chance that you already using it.

W3 Total Cache also gives you the ability to connect your site to S3 and Cloudfront. After you have installed and activated the plugin, you can enable AWS support by checking the CDN option in the plugins General Settings and selecting “Amazon Cloudfront” underneath the Origin drop-down. Once you have saved these settings you can access W3 Total Cache -> CDN and enter in the Access Key and Secret Access Key for your account in the “Configuration” section. This will automatically pull in the bucket you created, which you can select next to “Origin”.

W3 Total Cache plugin
W3 Total Cache plugin

Configuring W3 with Amazon S3

In the General Settings, you can chose which files you would like to store on AWS. You can actually store your entire site, including theme files and WordPress core files, so that virtually nothing exists on your actual host. I’d recommend simply checking off “Host attachments,” “Host theme files,” and “Host custom files”. With its default settings, this will include all media files you uploaded, images, stylesheets and script files from your theme, and any static assets added elsewhere. For each category, you can specify exactly what file extensions to upload to S3, to limit it to just the assets you want.

The last step is to upload your existing files to S3. Fortunately, the plugin features a built in way to do this, and with the click of a button you can perform the export automatically. After you’ve uploaded your existing files, your site will be all set up to use a CDN, and all future files added will be uploaded straight to the cloud and served to users from Cloudfront.

Amazon S3 and Cloudfront Plugin

If you are not looking for a full-featured caching plugin, and would simply like to offload static assets to AWS, you can use the Amazon S3 and Cloudfront plugin, which should be downloaded on top of the Amazon Web Services plugin. The latter will connect your WordPress site to AWS, and the former will store your media files in the cloud. The plugin is limited to just media files from the media library, but these are the heaviest files on your site, and therefore most suited for a CDN.

To set the plugin up, you will need your Access Key and Secret Access Key to your site’s wp-config.php file. Open up wp-config.php for your site, and add in these two lines:

01
02
define( 'AWS_ACCESS_KEY_ID', '*****************<strong><em>' );
define( 'AWS_SECRET_ACCESS_KEY', '</em></strong>*************************************' );

Make sure to replace the stars with your created user’s access key and secret access key.

Once you’ve added these keys and saved your settings, you can customize the plugins functionality in AWS -> S3 and Cloudfront. On this screen, you can customize which S3 bucket you want to use for your media files, and optionally add support for Cloudfront distribution. The plugin will work just fine without this, but it will speed things up considerably for you if you chose to use it.

Amazon S3 and Cloudfront Plugin
Amazon S3 and Cloudfront Plugin

Basic Settings for the plugin

There are also a few more settings for the plugin, such as whether or not to store files locally and in the cloud, and whether or not to serve files over SSL. You will need to check off these boxes in order for the plugin to begin working with the cloud. Once everything is set up, future files will be uploaded and served to users according to your settings. At the moment, the plugin does not support uploading existing files to AWS. The plugin keeps things fairly simple, makes set-up easy and does most of the work for you behind the scenes.

Backup Plugins

Of course, uploading static assets to the cloud is not the only thing that S3 can be used for. There are also several plugins that allow you to perform automatic backups of your site and store them on your cloud server, to keep the costs of hosting them down.

There are several plugins out there that include this functionality, but the most popular reliable are BackupBuddy, a premium plugin, and Updraft Plus, a freemium option. Both have an option to host backups on S3, in addition to other third party services like Dropbox and Google Drive, and both perform backups automatically according to a schedule you set. Simply by entering in the Access Key and Secret Access Key of your AWS account, you can get up and running with the plugins.

The main difference is that BackupBuddy tends to offer a lot more features to site owners looking to ensure that backups are easy to store and easier to recover. This also includes round the clock support which can be helpful in a crisis. Updraft Plus uses a similar method for backups, but it keeps things simple in its free version, and is sometimes easier to get started with.

In both cases, using S3 as your backups location is a safe and low-cost solution to a common problem. And since backups happen on the backend, there is no need for Cloudfront, making things even cheaper.

Using S3 To Boost Performance

In the WorPress world, there are Plenty of other ways to make use of S3, depending on the needs of your site. For instance, an S3 extension for Easy Digital Downloads makes it easy to host files that are available for purchase on your site.

S3 Media Maestro settings
S3 Media Maestro settings

Use S3 to stream videos

Or, if you are running a site with a lot of video, you can use S3 Media Maestro to store and stream your videos straight from the cloud. If you would prefer not to rely on a third party service like YouTube to host your videos, or need to ensure that only certain users can view your videos, then this can be an attractive option.

The bottom line is that a combination of S3 and Cloudfront can give your site a great performance boost, while also cutting the cost of hosting down. It is not a full-featured hosting solution, which is why it shouldn’t be used to host your entire site. But by using a few plugins, you can connect your WordPress site up to AWS with ease, and not have to worry about the backend mechanics. If you’re looking for a quick win in terms of speed, there really is no better alternative.


http://www.cagrimmett.com/2017/02/08/serving-static-assets-from-amazon-s3.html

How to Serve Static Website Assets from Amazon S3

February 8, 2017

Earlier this week I looked at my web hosting’s usage stats and decided that I
needed to move a bunch of static assets (mostly PDFs) somewhere else because
they were eating my available bandwidth. A bunch of hot links around the web
caused some usage spikes.

I’m a firm believer in learning by doing, so I decided to use this opportunity
to learn a bit about Amazon Web Services and set up an S3 bucket from which to
serve my static assets. To my surprise it took less than an hour to get
everything up and running.

This guide is for people who want to use S3 to host some static files to lower
their hosting costs. If you want to host your whole static site (Jekyll, Hugo,
etc) on S3,
follow this guide.
If you are using WordPress and want to host your images on S3,
follow this guide instead.

Setting up S3

Set up an account with the Free Tier. If you are
getting a decent amount of traffic, you’ll quickly run over the free limit of 5
GB of Standard Storage,20000 Get Requests, and 2000 Put Requests. It took me
about a week to pass it up. Thankfully, S3 is much cheaper than paying for
additional bandwidth on A Small Orange, so I’m still ahead.

One note that I’ll expand upon later: By checking the logs, I discovered that
the majority of the hits are coming from 5 IP addresses that all resolve to
Cloudflare. I have Cloudflare running on my site for
caching and SSL, which means they regularly crawl my site and cache the assets.
This ate through my Free Tier limits in just one week. If you use Cloudflare for
caching, I suggest turning it off unless you know you need it.

Create a new bucket.
The region mostly doesn’t matter unless you know that the bulk of your traffic
comes from one place. If it does, pick the closest region. Make sure you enable
logs when it prompts you. This will be useful for tracking & analytics later.

Uploading Assets

Now that you have your first bucket, it is time to put stuff in there. If you
have a local backup of your website (and you should), identify the directories
where you store static content like images, PDFs, HTML, CSS, Javascript, etc. No
files ending in .php or .rb – those are server side files that can’t be
executed on S3.

You can
upload straight from the browser
or you can set up access keys to connect
via a file transfer client. I use Transmit for my
file transfer needs, but CyberDuck is a good free
alternative. Both have options for connecting to S3 buckets.

When you upload files, try your best to keep the same folder structure from your
website root. That will make writing redirects to S3 easier.

Once you’ve uploaded some files, make sure you can access them through the
browser by setting the permissions to Public. You can do this on a
file-by-file basis
or by selecting all of your files, clicking the “More ↓” dropdown, and
clicking “Make Public”. Now verify that you can reach your asset by going to
http://s3.amazonaws.com/[YourBucketName]/[filepath]. For example, my website’s
avatar is available at http://s3.amazonaws.com/cagrimmett/img/avatar.png

If that worked, your assets are now available on S3. Now it is time to redirect
traffic to them.

Redirecting Requests

I’m assuming here that your server is using Apache and you have access to your
.htaccess file. If you are using IIS instead,
refer to this.

Remember, always make website backups before doing anything that some guy on
the internet tells you to do.

Here are the rewrite settings I’m using in my main .htaccess file:

RewriteEngine On
RewriteRule ^justanswer/(.*) http://s3.amazonaws.com/cagrimmett/justanswer/$1 [QSA,NC,NE,R,L]
RewriteRule ^img/(.*) http://s3.amazonaws.com/cagrimmett/img/$1 [QSA,NC,NE,R,L]
RewriteRule ^static/(.*) http://s3.amazonaws.com/cagrimmett/static/$1 [QSA,NC,NE,R,L]

Here is what each line does:

  • RewriteEngine On – Turns on the ReWriteEngine so we can use it.
  • RewriteRule ^justanswer/(.*) http://s3.amazonaws.com/cagrimmett/justanswer/$1 [QSA,NC,NE,R,L]
    Takes any request to any file in http://cagrimmett.com/justanswer/ and
    forwards that request to http://s3.amazonaws.com/cagrimmett/justanswer/.
    Since I kept my folder structure, this works perfectly. The other two entries
    are similar. – QSA = Query String Append – NC = No Case – NE = No Escape – R =
    Redirect – L = Last – More info here:
    https://wiki.apache.org/httpd/RewriteFlags

After I turned it on, I gave it a few minutes to update and then checked my
site. When I right clicked to open images in a new tab or tried to download an
existing PDF, I got forwarded to AWS! Success!

Tracking & Analytics

If you enabled logging back in the setup step, you can plug in some third party
tools to parse the logs into useful analytics. I’m currently trying out two
tools: S3Stat and Qloudstat.

Pros/cons:

  • S3Stat is designed better and easier to use than Qloudstat.
  • Qloudstat is cheaper than S3Stat for small-time use.
  • I prefer using S3Stat, but right now I can’t justify spending $10/mo on it
    when there are other options.
  • I might roll my own with one of the many log parsing scripts on Github and my
    knowledge of D3.js. We’ll see.

Questions? Issues?

First, check out the docs.

If you still have questions or run into issues, drop a comment below and I’ll
get back within a few days to help.

Scroll to Top