My first firefox extension

My first firefox extensions checks the fingerprint of a ssl secured site.For online banking my bank advises me to check the fingerprint of the certificate of their site to make sure it is the right one. Every year the certificate is changed and they proclaim the new fingerprint.

So before login I always had to open the page info by clicking the lock icon, clicked show certificate and then compared the fingerprint displayed there with the one I stored in a file or on a paper. The the popups had to be closed again.

The ssl-fingerprint-check extension does all the work for me.

It can be checked out via anonymous svn with

svn co http://subversion.banapple.de/public/ssl-fingerprint-check

When I access the banks site it automatically compares the fingerprint of the certificate with a predefined value. If it matches a label in the status panel says that the fingerprint is ok or "INVALID FINGERPRINT".

The overlay file defines which xul elements are added to firefox. In this case a statusbarpanel is added to the status bar.

The rest is the javascript code to initialize the extension and handle load events which is defined in ssl-fingerprint-check.js.

Let's go through the code:

first listeners are registered such that the extension gets initialized when firefox starts and uninitialized when it stops.

window.addEventListener("load", function() { sslFingerprintCheck.init(); }, false);
window.addEventListener("unload", function() { sslFingerprintCheck.uninit(); }, false);

The init function gets the firefox browser element and adds a progress listener to it.

init: function() {
    var content = document.getElementById("content");
    
    if (content) {
      content.addProgressListener(sslFingerprintCheck_urlBarListener,
        Components.interfaces.nsIWebProgress.NOTIFY_STATE_DOCUMENT);
    }
  }

The current fingerprint and the common name of the certificate are hardcoded in the extension. If you want to make use of this extension you will probably have to change that or get an account in Diepholz.

var fingerprint = "ED:75:31:01:CE:09:71:3C:64:AB:EF:BD:28:AE:B5:3F:FF:87:07:B2";
var commonName = "banking.kreissparkasse-diepholz.de";

The progress listener calls the function checkCertificate on various events.
checkCertificate gets the certificate and then compares the fingerprint if the common name matches. It updates the statusbarpanel accordingly.

checkCertificate: function()
  {
    var certificate = sslFingerprintCheck.getCert();
    if (certificate != null) {
      //sslFingerprintCheck.debug("fingerprint="+certificate.sha1Fingerprint);
      //sslFingerprintCheck.debug("cert="+certificate.commonName);

      /* check for one specific commonName at the moment */
      if (certificate.commonName == commonName) {
        if (certificate.sha1Fingerprint==fingerprint) {
          newLabel = "fp ok";
        } else {
          newLabel = "INVALID FINGERPRINT";
        }    
      } else {
        newLabel = "no banking"; 
      }
      document.getElementById("ssl-fingerprint-check-panel").label = newLabel;
    } else {
      document.getElementById("ssl-fingerprint-check-panel").label="no ssl";
    }
  }

The sites which helped to develop this extension are named in the source code.

To test the extension follow the instructions on
developer.mozilla.org section 'Test'.

Possible improvements for this extension:

• provide a preferences window where pairs of common names and fingerprints can be managed


• display a fancy icon for the fingerprint check instead of a label


• display the icon in the ssl status bar panel right to the lock icon