Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
The PasswordCredential
constructor creates a new PasswordCredential
object. In supporting browsers, an instance of this class may be passed the credential
from the init
object for global fetch
.
Syntax
var myCredential = new PasswordCredential(passwordCredentialData) var myCredential = new PasswordCredential(HTMLFormElement)
Parameters
Either of the following:
- passwordCredentialData
- A PasswordCredentialData dictionary containing the following fields:
iconURL
: (Optional) the URL of a user's avatar image.id
: The ID of the user signing in.name
: (Optional) The name of the user signing in.password
: The password of the user signing in.
- htmlFormElement
- A reference to an
HTMLFormElement
with appropriate input fields. The form should, at the very least, contain an id and password. It could also require a CSRF token.
Examples
This example shows how to set up an HTMLFormElement
to caputure data which we'll use to create a PasswordCredential
object.
Starting with the form element.
<form id="form" method="post"> <input type="text" name="id" autocomplete="username" /> <input type="password" name="password" autocomplete="current-password" /> <input type="hidden" name="csrf_token" value="*****" /> </form>
Then, a reference to this form element, using it to create a PasswordCredential
object, and storing it in the browser's password system.
var form = document.querySelector('#form'); var creds = new PasswordCredential(form); // Store the credentials. navigator.credentials.store(creds) .then(function(creds) { // Do something with the credentials if you need to. });
Specifications
Specification | Status | Comment |
---|---|---|
Credential Management Level 1 | Editor's Draft | Initial definition. |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 51.0 | ? | ? | ? | ? |
Feature | Android | Android Webview | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | No support | 51.0 | ? | ? | ? | ? | ? | 51.0 |