edgeworkscreative / pwned-password

:lock: :boom: Web component built to prevent the use of passwords found in previous data breaches via Have I Been Pwned API

Home Page:https://www.npmjs.com/package/@edgeworkscreative/pwned-password

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Built With Stencil

Pwned Password Component

Web component built with Stencil that utilizes the Have I Been Pwned API to prevent the use of passwords found in previous data breaches.

Only the first 5 characters of the SHA-1 hash are sent to Have I Been Pwned.

DEMO

Using the Pwned Password component on your site

Simply place this script tag in the <head> of your website:

<script src="https://unpkg.com/@edgeworkscreative/pwned-password@latest/dist/pwned-password.js"></script>

Now you can use the component anywhere in the body of your site:

<pwned-password name="password" placeholder="Enter your password"></pwned-password>
document.addEventListener('pwnedPasswordFound', (e) => {
  if (e.detail === 0) {
    let password =  e.srcElement.querySelector('input').value;
    console.log('Password hasn\'t been pwned - submit your form');
  } else {
    alert(`Password has been pwned ${e.detail} times!`);
  }
})

About

:lock: :boom: Web component built to prevent the use of passwords found in previous data breaches via Have I Been Pwned API

https://www.npmjs.com/package/@edgeworkscreative/pwned-password

License:MIT License


Languages

Language:TypeScript 59.1%Language:HTML 40.9%