Topics

CSS

Varnish with secure AWS S3 bucket as backend

Serving static contents from S3 is common, but using Varnish in front is a bit tricky. Especially if you want to keep the bucket secure and only serve from Varnish, here is a simple Varnish file to solve this problem.

First secure your bucket via IP policy:

{
  "Version": "2012-10-17",
  "Id": "S3PolicyId1",
  "Statement": [
    {
      "Sid": "IPAllow",
      "Effect": "Allow",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::example.bucket/*",
      "Condition": {
        "IpAddress": {
          "aws:SourceIp": [
            "5.6.7.8/32"  //varnish ip
          ]
        }
      }
    },
    {
      "Sid": "Explicit deny to ensure requests are allowed only from specific referer.",
      "Effect": "Deny",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::example.bucket/*",
      "Condition": {
        "StringNotLike": {
          "aws:Referer": [
            "https://example.com/*"
          ]
        }
      }
    }
  ]
}

jQuery plugin : monnaTip 0.1

This the simplest tooltip jQuery plugin you can find around.

    features:
  • takes advantage of live(), mouseenter and mouseleave methods
  • tracks mouse movement
  • right and bottom viewport border tracking
  • can be applied on any element

DemodownloadGoogle codeGitHub