Difference Between Obscure & Password Type in Magento 2

Today, we are going to talk about the difference between Obscure and Password Type in Magento 2. After reading this post, you’ll have complete knowledge about both the fields of the system configuration in Magento 2.

Now, there are lots of types of fields in system configuration. These fields are used when we want to set up some specific value for either the entire web store or some part of it.

For instance, let’s suppose that you want to hide some secret details from other users or admins. For this, you’ll have two field options to use for security - Obscure & Password type fields.

Below, we have explained both the fields in detail so you can easily decide which field to use between the two.

What is Obscure Type?

Obscure type, as you might have already guessed, helps to display the value as a secret text.

You can define Obscure type by using type=”obscure” in your code.

This is useful when you want to prevent other users from getting the secret value from the inspect element of your web store.

In simple words, many times users try to forcefully change the field type from “Obscure” to “Text” in the inspect element.

But, the Obscure field type still won’t show the real value in HTML. It just returns an asterisk value like “*********”, even after you change the field type from Obscure to Text.

That being said, here’s the syntax to add Obscure field type in Magento 2:

<field id="secret_key" translate="label" type="obscure" sortOrder="41" showInDefault="1" showInWebsite="1" showInStore="0">

What is Password Type?

Password type is similar to the Obscure type field in Magento 2. The only difference is that the Password type field cannot encrypt the secret text value like the Obscure type field.

In simple words, while it completely hides the secret text value, but if any user forcefully changes the field type from Password to Text in the inspect element, the user can retrieve the actual secret text value that was saved in the Password field.

We will show you how both works with a simple example. But first, let’s see the syntax to add the Password type field.

Here’s the syntax to add Password type field in Magento 2:

<field id="password_key" translate="label" type="password" sortOrder="41" showInDefault="1" showInWebsite="1" showInStore="0">

Example:

Here, we will be creating a simple module to test the password type field.

To create the module, you can follow our step-by-step tutorial - How to Create a Simple Module in Magento 2.

And, if you haven’t yet installed Magento 2 on your system, we’ve also posted a tutorial on How to Install Magento 2 using Composer.

Once you have installed Magento 2 and created a simple module, you will need to create app/code/MD/Helloworld/etc/adminhtml/system.xml file and insert the following code:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
    <system>
        <tab id="md" translate="label" sortOrder="10">
            <label>MD</label>
        </tab>
        <section id="helloworld" translate="label" sortOrder="130" showInDefault="1" showInWebsite="1" showInStore="1">
            <label>Hello World</label>
            <tab>md</tab>
            <resource>MD_Helloworld::helloworld_config</resource>
            <group id="general" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="0" showInStore="0">
                <label>General Configuration</label>
                <field id="secret_key" translate="label" type="obscure" sortOrder="40" showInDefault="1" showInWebsite="1" showInStore="0">
                    <label>Secret Key</label>
                </field>
                <field id="password_key" translate="label" type="password" sortOrder="50" showInDefault="1" showInWebsite="1" showInStore="0">
                    <label>Password Key</label>
                </field>
            </group>
        </section>
    </system>
</config>

And done! The only thing that remains now is to add value in both given fields and save the config.

Now, go ahead and open the inspect element to change both field type to Text.

As we said earlier, you will see an asterisk value for the Obscure type field and you will get the real value for the Password type field.

Also read: How to Reset Admin Password in Magento 2?

Final Words…

And there you have it!

We hope that you now finally know the difference between Obscure and Password type field in Magento 2.

In case we missed any needful information, please let us know in the comments below.

And if you need any further help, feel free to contact us.