Asset Platform V3

If you're using our Asset Platform V3, you can associate custom domains with our Asset Platform. Check our how-to here.

Asset Platform V2

The Servd Assets Platform allows you to manage your assets and optimise your images via Servd's built-in services. But when you do this the URLs for those images will always contains Servd's domain names:

`cdn2.assets-servd.host`

`optimise2.assets-servd.host`

In some circumstance you might want to replace these domains with your your own domains or subdomains:

`images.mysite.com`

Although Servd doesn't support this as a built-in feature, it can be achieved using a request proxy service which can adjust the domain on the fly. Below we'll detail how to set this up for free using Cloudflare workers.

Log into your Cloudflare account and select 'Workers' from the domains dropdown menu in the top navigation
Click 'Create a Service'
Give your service a sensible name, something like 'servd-image-optimise-proxy'. Select the HTTP Router option and then click the 'Create service' button.
On the next screen, click the 'Quick Edit' button.

In the code pane on the left copy and paste the following:

const servdDomain = 'https://optimise2.assets-servd.host';addEventListener('fetch', event => {
 event.respondWith(handleRequest(event.request))
})async function handleRequest(request) {
 let requestURL = new URL(request.url)
 let newRequest = new Request(request) // Handle auto webp
 if(requestURL.searchParams.has('auto')) {
 
 // They've asked for auto webp
 let autoParts = requestURL.searchParams.get('auto').split(',');
 if (autoParts.indexOf('format') >= 0) { if (request.headers.has('accept') && request.headers.get('accept').indexOf('image/webp') >= 0) {
 // Forward the webp acceptance to upstream
 newRequest.headers.set("accept", "image/webp")
 // We need to prevent caching of webp images for 
 // browsers which don't support them
 // We achieve this by adding an additional query param 
 // which the upstream service ignores
 requestURL.searchParams.set('proxyUrlAddition', "supports-web-p")
 }
 }
 } let servdUrl = servdDomain + requestURL.pathname + requestURL.search
 return await fetch(servdUrl, newRequest)
}

Click the 'Save and deploy' button.

Create another service (we suggest naming it 'servd-files-proxy') following the same steps with the following code:

const servdDomain = 'https://cdn2.assets-servd.host';addEventListener('fetch', event => {
 event.respondWith(handleRequest(event.request))
})async function handleRequest(request) {
 let requestURL = new URL(request.url)
 let newRequest = new Request(request) let servdUrl = servdDomain + requestURL.pathname + requestURL.search
 return await fetch(servdUrl, newRequest)
}

Navigate to your project's CloudFlare website.
Select 'DNS' from the subnavigation bar and add two DNS CNAME records, one for images and one for files.

The address added to these records doesn't matter - they'll be rerouted to your workers by CloudFlare anyway. We normally use the Servd project's CNAME address which can be found on the project's Domains page.

The records must be proxied through CloudFlare (orange cloud). e.g.:

CNAME - images.mysite.com - my-site-production.cl-eu-west-1.servd.dev - Orange Cloud
CNAME - files.mysite.com - my-site-production.cl-eu-west-1.servd.dev - Orange Cloud
Select 'Workers' from the subnavigation bar
Click 'Add Route' and enter the domain or subdomain that you'd like to use. For example:
```
*images.mysite.com/*
```
Select your new optimise worker and 'Save'
Do this again for your files worker using a different domain or subdomain
Servd Plugin >= 2.0.5

In your Craft project update your Servd Assets volume to have a Custom CDN URL Pattern which looks like this:

https://files.mysite.com/#{{projectSlug}}/#{{environment}}/#{{subfolder}}/#{{filePath}}

And a Custom Image Optimise URL Pattern which looks like this:

https://images.mysite.com/#{{projectSlug}}/#{{environment}}/#{{subfolder}}/#{{filePath}}#{{params}}

Feel free to experiment with the placeholders in these URLs by removing them and adding appropriate logic to your CloudFlare worker to compensate.

Servd Plugin < 2.0.5

In your Craft project update your Servd Assets volume to have a Base URL that matches the domain of your new files worker.

Set the Optimise Prefix to the domain you have used for your optimise worker
All of your images and files should now be being served from your own domain.