Introduction
Cloudflare is a service similar to CDN (read about differences) and you can use Cloudflare as both a DNS provider and as an origin for a CDN service.
Adding CDN CNAME with Cloudflare
Adding a CDN CNAME (for customized CDN URLs) with Cloudflare is exactly the same procedure as adding a CDN CNAME with any other DNS provider. Just fill in the details from the Services/How-To page to the Cloudflare portal as in the picture below.
Make sure that "Traffic to this hostname will not go through Clouflare" and then click the Add Record button and that's all.
Using Cloudflare as origin
You can use Cloudflare as origin for a CDN service but you must ensure that the CDN service has the Set-Cookie option set to ignore.
Cloudflare adds custom Set-Cookie HTTP response header to every response similarly as in the example below.
curl -I my-website-using-cloudflare.com HTTP/1.1 200 OK Server: cloudflare-nginx Date: Mon, 12 Mar 2013 12:29:32 GMT Content-Type: text/html; charset=utf-8 Connection: keep-alive Set-Cookie: __cfduid=d27bf7e957ca563b63f4619d8aba12c301395059372558; expires=Mon, 23-Dec-2019 23:50:00 GMT; path=/; domain=.my-website-using-cloudflare.com; HttpOnly
Under normal circumstances responses containing Set-Cookie headers are never cached please read more here. It is not what you want because you want the CDN to cache your static assets (e.g. images, CSS, JavaScripts,..). The solution is simple just set the CDN service option Set-Cookie to ignore to enable caching of responses containing Set-Cookie headers and that's all.
Differences between Cloudflare and Content Delivery Network (CDN)
Both Cloudflare and traditional (our) CDN act as reverse proxies but there are significant differences between them.
- Cloudflare requires that you change your current DNS provider to Cloudflare. To use CDN you don't need to do any changes in your DNS.
- With Cloudflare all your traffic goes through Cloudflare, even the traffic that is not being cached, e.g. HTML files containing dynamic database results. So when your visitor requests some dynamic HTML file then instead of this way: visitor → your site → visitor the communication goes this way: visitor → Cloudflare → your site → Cloudflare → visitor and these two extra hops can reduce speed of your site. With CDN you have full control over what goes through CDN and what does not.
- CDN provides you more control over its caching mechanism than Cloudflare.
- Cloudflare does not require any changes in your HTML code. CDN requires that you change URLs of your static assets (such as images, CSS, JavaScripts, etc.) to point to a CDN domain.
What next?
Read about the following topics.