Securing the Modern Web: What Every Web Developer Should Know About SSL

When you develop a website, there are many things you need to consider. Security is also one of them. With cyberattacks on websites rising every year, it has become an additional responsibility of web developers to build a solid foundation for the security of their websites. SSL is also a part of that foundation. So, if you’re a web developer, there are certain things you must know about it in order to ensure the security of your websites. Here we’re going to cover those things for you, so you can develop websites that are SSL-protected.

SSL and TLS: What’s the difference

First, an important fact: What we’re talking about is NOT SSL!  That’s right – it’s Transfer Layer Security (TLS) protocol that secures our webpages today. The TLS is a successor to SSL 3.0, and it was adopted way back in 2014 after SSL was found vulnerable to POODLE attacks. However, SSL continued to be the mainstream term for secure data transfer protocol of Web, which is why we still talk of SSL instead of TLS. But as a developer you should keep in mind that although we call it SSL, we’re referring to TLS.

How SSL works: The TLS Handshake

Now, the next important thing for a developer to know about SSL is how it works. Basically, it works by establishing a secure connection known as a “session” between the web browser of a user (known as “client”) and the host of a website (known as “server”). This secure connection is established over HTTPS protocol, and here’s how it’s done:

  1. Client Hello: Whenever a user fires any HTTPS-based URL from his/her web browser, the browser sends a “hello” message to the web server hosting that URL. This message also includes crucial details about the capabilities of browser, like the highest SSL version it supports (i.e. TLS 1.0, TLS 2.0, TLS 3.0 etc), the cipher suites supported by it, and a random byte string called client random.
  2. Server Hello: Upon receiving this message, the server sends its own “hello” message to the client. This message includes information about the cipher suite chosen by the server from list provided by the client, a session ID, its SSL certificate, the public key of certificate, and another random string of bytes called server random.
  3. Authentication: The client then verifies the SSL certificate sent by the server from its Certificate Authority (CA) to ensure that the communication is happening with the actual owner of a domain name.
  4. Sending of Premaster secret: Upon successful verification of SSL certificate, the client sends another random string of bytes, called a Premaster secret, to the server. This premaster secret is encrypted by the public key of SSL certificate that was sent along with the Server Hello message.
  5. Decryption of Premaster secret: The server decrypts message received from client with its Private key and extracts the premaster secret.
  6. Creation of Session keys: Now the server and client both create session keys from client random, server random and premaster secret. The computation results in same output (aka same keys) on both sides.
  7. Client ready: Client sends a “finished” message to server once session keys have been created.
  8. Server ready: Server sends a “finished” message to client once session keys are created.
  9. Encryption achieved: That’s it. Secure connection has been achieved now, and webpages protected with encryption can be transferred now between both client as well as server.

So that’s how a TLS Handshake helps in creation of a secure connection between client and server over HTTPS protocol. Once this connection has been established, both client as well as server encrypt every file and webpage before it’s sent by them. The files and webpages are then decrypted by the receiving party (i.e. server or client) using the session key.

The right time to install an SSL certificate

It’s also important for every developer to know the right time of installing an SSL certificate. The SSL certificate should be installed early in the life of a website, usually before you start uploading your webpages to the server. There’s a solid reason behind it. If you upload all your webpages and files to the server but install the SSL certificate later, some of your files (i.e. images, java scripts etc.) may load through the unsecure HTTP protocol despite your webpages loading on HTTPS.

Do you know why?

Because your webpages will have HTTP links referring to those files. And when webpages are requesting a file over HTTP, it’ll by default load over HTTP instead of HTTPS. It is called mixed content error. In such a situation, your website may not show the green padlock of SSL, because some elements will be loading over unsecured HTTP protocol. When that happens, the browsers may mark your website as ‘Not secure’ despite your website having SSL certificate installed properly. To fix this thing you’ll have to do the additional work of changing all HTTP references to HTTPS references in the code of every single webpage that you developed.

Now, if you want to avoid this problem, the solution is to install your SSL certificate right in the beginning of site development. If you install it before uploading all the webpages and files to the web server, the references to all files in your webpages will have HTTPS links only, thus eliminating the possibility of ‘no padlock’ from all your webpages.

How to Force SSL: Creating Redirects

Finally, every web developer should also know how to force a website to load on HTTPS even if someone tries to access it through the insecure HTTP protocol. That is achieved by creating redirects, and you should learn how to create the necessary redirects in your web server to force the loading of your website on SSL-protected HTTPS protocol. Generally, the process looks something like this (for example in cPanel):

  1. Login to the cPanel (or any other Control panel, depending on your host) of your website;
  2. Navigate to the Redirects section either by clicking an icon or searching for it;
  3. Create a permanent (301) redirect for your HTTP homepage (i.e. http://xyz.com/) to HTTPS homepage (i.e. https://xyz.com/);
  4. Save the changes.

That’s it. The process may vary slightly for different cPanel, but it’s roughly the same. You may have to research a little more to get guide for cPanel.

The pricing of SSL certificate varies

If you’re going to purchase the certificate yourself, it’s also crucial to know that the pricing of SSL certificates varies between CAs and vendors. For example, a RapidSSL Wildcard certificate may cost more or less than a DigiCert Wildcard SSL certificate. Therefore, you should also do a comparison of pricing before choosing an SSL certificate for the site which you’re developing.

Conclusion

So that’s what every web developer should know about SSL certificates. This information can come handy when you develop your next site as it can save you from doing any sort of mistakes while deploying SSL certificate. And when you do less mistakes, you’ll save both time as well as money. So, keep all these things in the back of your mind, and keep developing!

Sharing is caring!