On using the Symfony NotCompromisedPassword security validator

Published on 2019-06-05 • Modified on 2019-06-05

In this post we will see how to use the NotCompromisedPassword validator which was introduced in Symfony 4.3. This validator allows us to check if a given password was publicly exposed in a data breach and is therefore compromised. We will see how to use it manually and how to offer the ability to the user to test their password with this validation. Let's go! 😎

» Published in "A week of Symfony 649" (3-9 June 2019).

Configuration

Let's go!

First let's create a basic form to test a password. Nothing complicated here, we have a password input and a button to submit the form. You can test it, the value is submitted via Ajax and you will get the validation result with a simple Javascript alert.


Check if a password has been leaked in a data breach

Don't use here a password you are using for real.

Let's have a look at the code used to test the password:

<?php declare(strict_types=1);

// src/Controller/Post/Post26Trait.php

namespace App\Controller\Post;

use App\Type\AccountCreateType;
use Symfony\Component\Form\FormFactoryInterface;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Routing\Annotation\Route;
use Symfony\Component\Validator\Constraints\NotCompromisedPassword;
use Symfony\Component\Validator\ConstraintViolation;
use Symfony\Component\Validator\Validator\ValidatorInterface;

/**
 * Functions for blog 26th post.
 */
trait Post26Trait
{
    /**
     * @Route("/26/check-password", name="check_password", methods={"POST"})
     */
    public function checkPassword(Request $request)
    {
        if (!$this->validator instanceof ValidatorInterface) {
            throw new \RuntimeException("Houston, we've got a problem! πŸ’₯");
        }

        $clearPassword = $request->request->get('password');
        $constraints = [
            new NotCompromisedPassword(),
        ];

        $violations = $this->validator->validate($clearPassword, $constraints);
        $messages = [];
        if ($violations->count()) {
            foreach ($violations as $violation) {
                if ($violation instanceof ConstraintViolation) {
                    $messages[] = '❌ '.$violation->getMessage().' ❌';
                }
            }
        } else {
            $messages[] = 'βœ… This password has NOT been leaked in a data breach. βœ…';
        }

        return $this->json(['message' => implode(',', $messages)]);
    }

As you can see we are manually instantiating the NotCompromisedPassword constraint to test the password against it. Even we are using only one constraint, we are looping to get the error message in order to build our own message. You can avoid this by casting violations to string. $message = '❌ '.$violations;. In this case the message will contain the password you entered. The validator works as expected, now let's see how to use it in a standard account creation form.

Using the validator in a subscribe form

I personally think this type of validation shouldn't be done every time and in every case. A good practice can be to ask the user for their permission to enable a feature (yes, the famous GDPR laws!) To do this, we will add a checkbox to enable the feature, this checkbox should be unchecked by default to respect GDPR directives. Here, we won't rely on an entity but we will build a form type manually. It will be very simple and will contain a login, a password and our checkbox. Here is my proposition. You can test it, this time the page will get reloaded and you will see the errors depending on the values you have entered. Login and password fields are mandatory.


Let's have a look at the corresponding form type, nothing complicated here, we add the three fields. The main difference with a basic form resides in the fact that an additional validation is triggered if the box was checked. In order to do this, we had a Callback validator at the type level in the configureOptions() method. (unlike other constaints how are usasually bound to each field). This special validator will have access to all submitted form values so we can do more complex validation.

<?php declare(strict_types=1);

// src/Type/AccountCreateType.php

namespace App\Type;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\Extension\Core\Type\CheckboxType;
use Symfony\Component\Form\Extension\Core\Type\PasswordType;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use Symfony\Component\Form\Form;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\Form\FormError;
use Symfony\Component\OptionsResolver\OptionsResolver;
use Symfony\Component\Validator\Constraints\Callback;
use Symfony\Component\Validator\Constraints\NotBlank;
use Symfony\Component\Validator\Constraints\NotCompromisedPassword;
use Symfony\Component\Validator\ConstraintViolationList;
use Symfony\Component\Validator\Context\ExecutionContextInterface;

/**
 * Fake account creation form.
 */
class AccountCreateType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options): void
    {
        $builder->add('login', TextType::class, ['constraints' => [new NotBlank()]]);
        $builder->add('password', PasswordType::class, ['constraints' => [new NotBlank()]]);
        $builder->add('check_password', CheckboxType::class, ['required' => false]);
    }

    /**
     * Conditional validation depending on the checkbox.
     */
    public function validate(array $data, ExecutionContextInterface $context): void
    {
        // Not checked so continue.
        if (!$data['check_password']) {
            return;
        }

        $violations = $context->getValidator()->validate($data['password'], [
            new NotCompromisedPassword(),
        ]);

        // If compromised assign the error to the password field
        if ($violations instanceof ConstraintViolationList && $violations->count()) {
            $password = $context->getRoot()->get('password');
            if ($password instanceof Form) {
                $password->addError(new FormError((string) $violations));
            }
        }
    }

    public function configureOptions(OptionsResolver $resolver): void
    {
        $resolver->setDefaults([
            'constraints' => [
                new Callback([$this, 'validate']),
            ],
        ]);
    }
}

More explanation about this validate method. The first argument is an array containing all the submitted values of the form. What is important here is that these values have already been validated individually. The second argument is the global context of the form type, we can access all fields through it. First, we test if the box was checked, we are sure the value is a boolean as the associated type is a CheckBoxType. If false, we don't have to do additional process. If true, we get the clean password value and we manually validate it against the NotCompromisedPassword constraint. This returns a ConstraintViolationList object which implements the Traversable and Countable interfaces. So the count() function will tell us if there is at least one violation. If this is the case, we extract the error message by casting this object to a string. Then we assign this error to the password field so the message is displayed just below the corresponding form field in our html form.

That's it! I hope you like it. Check out the links below to have additional information related to the post. As always, feedback, likes and retweets are welcome. (see the box below) See you! COil. 😊

 The Symfony doc  More on the web

They gave feedback and helped me to fix errors and typos in this article, many thanks to: danabrey, greg0ire, jmsche. πŸ‘

Bonus: The vue.js code used by the first test box. (I am a <details> html tag! πŸ™ƒ)
{% trans_default_domain 'post_26' %}
<script>
    /*global $, console, $http */
    /*jslint browser:true */
    "use strict";
    let vue = new Vue({
        delimiters: ['{', '}'],
        el: '#vue-26',
        data: {
            password: '',
            checkPasswordPath: '{{ path('blog_check_password') }}',
            errorMsg: '{{ 'form_error'|trans }}',
        },
        methods: {
            checkPassword: function () {
                const formData = new FormData();
                formData.append('password', this.password);
                this.$http.post(this.checkPasswordPath, formData).then(response => {
                    alert(response.body.message);
                }, response => {
                    alert(this.errorMsg);
                });
                this.password = '';
            },
        }
    });
</script>


» Call to action

Did you like this post? You can help me back in several ways: (use the Tweet on the right to comment/contact me )

  • Report any error/typo.
  • Report something that could be improved.
  • Like and retweet!
  • Follow me on Twitter
  • Subscribe to the RSS feed.

Thank you for reading! And see you soon on Strangebuzz! πŸ˜‰

COil