Skip to content

Instantly share code, notes, and snippets.

@lfjeff
Created June 11, 2018 03:09
Show Gist options
  • Save lfjeff/cca9797f09acfba2140f95d8594df76d to your computer and use it in GitHub Desktop.
Save lfjeff/cca9797f09acfba2140f95d8594df76d to your computer and use it in GitHub Desktop.
Serve S3 images from your own domain using Cloudflare worker
addEventListener('fetch', event => {
event.respondWith(handleRequest(event.request))
})
/**
* When we receive a request, fetch it from our S3 bucket
*
* For example, a request for:
* https://mydomain.com/images/castle01.jpg
* will be fetched from:
* https://s3-de-central.profitbricks.com/my-images/test-folder/castle01.jpg
*/
async function handleRequest(request) {
// map our request folder to the s3 folder
let requestFolder = '/images'
let s3Folder = '/my-images/test-folder'
let url = new URL(request.url)
let origPathname = url.pathname
// fetch from the folder on our s3 bucket
url.hostname = 's3-de-central.profitbricks.com'
url.pathname = origPathname.replace(new RegExp('^'+escapeRegExp(requestFolder)), s3Folder)
return await fetch(url, request)
}
function escapeRegExp(string) {
return string.replace(/[.*+?^${}()|[\]\\\/]/g, '\\$&'); // $& means the whole matched string
}
@lfjeff
Copy link
Author

lfjeff commented Jun 11, 2018

This script runs on Cloudflare as a worker script and allows you to serve files stored on your S3 bucket. The files appear to be coming from your domain and the S3 bucket is hidden.

Of course, this script is no substitute for maintaining proper security on your S3 bucket.

@MarsVard
Copy link

MarsVard commented Dec 7, 2020

Does caching still work using this method?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment