Cloudflare is a system for website performance optimization, traffic routing and attacks prevention. Among the variety of services and features the Cloudflare offers, there is an SSL/TLS encryption as well.

After the setup, the www subdomain will use Cloudflare nameservers, while the bare domain will still be on our web hosting DNS. To route the website traffic via Cloudflare, you need to set up automatic redirect from domain.com to www.domain.com.

So, let’s see how to use SSL and Cloudflare at the same time.

Cloudflare offers four SSL modes for all plans:

• Off - only http:// connection to the website is possible.
• Flexible SSL - the secure connection between the site visitor and Cloudflare, but no SSL between Cloudflare and your web server. You don't need to have an SSL certificate on the web server, but the site visitors will still access the site via HTTPS without any warnings.
• Full SSL - SSL works between the visitor and Cloudflare, and SSL is on between Cloudflare and the web server. You will need to have a trusted SSL certificate or a self-signed one installed on the server.
• Full SSL (Strict) - similar to the Full SSL option, but the certificate installed on your web server must be issued for a hostname by a trusted Certificate Authority, installed fully on the server, and have an expiration date in the future.

  

Here we can distinguish two types of SSL certificates: custom SSL and UniversalSSL. The custom certificate is issued for a specific domain name by a trusted Certificate Authority and installed on the web server. UniversalSSL is a free certificate which works between your website visitors and the Cloudflare.

You can get UniversalSSL for free within 24 hours. The certificate will secure the root domain as well as a wildcard entry for all first-level subdomains (e.g., www.example.com , blog.example.com, etc.). It is recognized by all modern browsers supporting Elliptic Curve Digital Signature Algorithm (ECDSA). This slightly reduces the range of the web browsers able to connect via https:// , as some older web clients do not support ECDSA. For Cloudflare paid plans (Business or Enterprise) this restriction is not applied, both modern and older browsers can connect through https://. The next part of our post will explain how it works for domains hosted on Namecheap shared servers.

SSL + Cloudflare issues

Can I use a custom SSL certificate on a Free Cloudflare plan?

Unfortunately, Free Cloudflare plan does not allow using a custom SSL certificate. Even if the certificate is properly configured on the server, browsers will show “common name mismatch” errors. Acting as a proxy, Cloudflare hides real NS records of the domain, so the web client cannot reach and check the valid SSL certificate installed on the web server, but gets the SSL issued for Cloudflare. There are two ways to fix the mismatch: either upgrade to the paid Business or Enterprise plan, or disable Cloudflare. By disabling the Cloudflare you will change the NS records back to hosting DNS; then the clients will be able to reach the server directly and verify your certificate as trusted. A paid plan will let you upload the custom certificate to the Cloudflare account.

As an option, you can enable the Full SSL Strict mode on a Free plan and use your trusted certificate together with UniversalSSL from Cloudflare.

Why are images/css/js files missing when loading HTTPS?

After the SSL certificate is up, the webpage loaded via https:// may be corrupted or miss some images. It is caused by objects that load via an insecure HTTP protocol on HTTPS page. Most modern browsers are blocking HTTP requests for security reasons. To fix it, the links should be loaded both via HTTP and HTTPS relatively. It is similar to the insecure content issue and can be fixed by installing the plugins or modules on the CMS or modifying the links manually. In order to create relative URLs referring to other websites the http:// protocols are replaced with double slashes // in the links, for instance:

//domain.com/path/to/picture.jpg

If the link refers to a directory or a file on the same website, one can omit the domain name at all, but use the path to the resource, e.g.

More details can be found here.

What do 52X errors mean?

There are two kinds of these errors: 525 and 526.

525 or SSL Handshake Failed appears when the Full SSL (Strict) mode is enabled, but the custom SSL certificate or the web server are not configured properly:

• the origin server does not support SNI or is not configured properly for it,
• the cipher suites that Cloudflare accepts and the cipher suites that the origin server uses do not match,
• the origin server is not configured to use SSL and Full SSL is enabled in the Cloudflare settings.

526 or Invalid SSL certificate returns for the Full SSL (Strict) mode and means that Cloudflare cannot validate the certificate as a trusted one. The possible reasons may be:

• the certificate on the server expired,
• the certificate installed on the end server is a self-signed one,
• the requested domain name (hostname) is not included as a Subject Alternative Name of the certificate,
• the certificate is installed without the CA certificates chain on the server.

Redirect loop after enabling Flexible SSL with WordPress.

The redirect loop may occur for WordPress sites after enabling UniversalSSL Flexible mode. The issue is caused by WordPress refusing to serve HTTPS connection, while the automatic redirect works at Cloudflare side. It is recommended to use Cloudflare plugin for WordPress to fix the issue. Alternatively, Cloudflare suggests using Cloudflare Flexible SSL WordPress plugin or WordPress HTTPS plugin.

Note: Please do not change the website URL to https:// in General Settings of WordPress. More information and detailed instructions here.