The React Native SDK provides methods for creating, storing, and authenticating password based users, as well as support for account recovery (password reset) and account deduplication with passwordless login methods.
Passwords
Methods
The SDK provides methods that can be used to create and authenticate password based users.
To call these methods, Passwords must be enabled in the SDK Configuration page of the Stytch dashboard.
Create
The send method wraps the create Password API endpoint.
Method parameters
import React, { useCallback } from 'react';
import { useStytch } from '@stytch/react-native';
export const Login = () => {
const stytchClient = useStytch();
const createPassword = useCallback(() => {
stytchClient.passwords.create({
email: '${exampleEmail}',
password: 'x&T$)&W%f#fM7t#C',
session_duration_minutes: 60,
});
}, [stytchClient]);
return <button onClick={createPassword}>Create Password</button>;
};
RESPONSE
{
"status_code": 200,
"request_id": "request-id-test-b05c992f-ebdc-489d-a754-c7e70ba13141",
"user_id": "user-test-16d9ba61-97a1-4ba4-9720-b03761dc50c6",
"email_id": "email-test-81bf03a8-86e1-4d95-bd44-bb3495224953"
}
Authenticate
The authenticate method wraps the authenticate Password API endpoint.
If this method succeeds, the user will be logged in, granted an active session, and the session data will be persisted on device.
You can listen for successful login events anywhere in the codebase with the stytch.session.onChange() method or useStytchSession hook.
Method parameters
import React, { useCallback } from 'react';
import { useStytch } from '@stytch/react-native';
export const Login = () => {
const stytchClient = useStytch();
const authenticatePassword = useCallback(() => {
stytchClient.passwords.authenticate({
email: '${exampleEmail}',
password: 'x&T$)&W%f#fM7t#C',
session_duration_minutes: 60,
});
}, [stytchClient]);
return <button onClick={authenticatePassword}>Authenticate Password</button>;
};
RESPONSE
{
"request_id": "request-id-test-b05c992f-ebdc-489d-a754-c7e70ba13141",
"session": null,
"session_jwt": "",
"session_token": "",
"status_code": 200,
"user": {...},
"user_id": "user-test-16d9ba61-97a1-4ba4-9720-b03761dc50c6",
}
Reset by email start
The resetByEmailStart method wraps the reset_by_email_start Password API endpoint.
If this method succeeds, the user will be logged in, granted an active session, and the session data will be persisted on device.
You can listen for successful login events anywhere in the codebase with the stytch.session.onChange() method or useStytchSession hook.
Method parameters
Additional configuration.
import React, { useCallback } from 'react';
import { useStytch } from '@stytch/react-native';
export const Login = () => {
const stytchClient = useStytch();
const resetPasswordStart = useCallback(() => {
stytchClient.passwords.resetByEmailStart({
email: '${exampleEmail}',
});
}, [stytchClient]);
return <button onClick={resetPasswordStart}>Reset Password Start</button>;
};
RESPONSE
{
"status_code": 200,
"request_id": "request-id-test-b05c992f-ebdc-489d-a754-c7e70ba13141",
"user_id": "user-test-16d9ba61-97a1-4ba4-9720-b03761dc50c6",
"email_id": "email-test-81bf03a8-86e1-4d95-bd44-bb3495224953"
}
Reset by email
The resetByEmail method wraps the reset_by_email Password API endpoint.
If this method succeeds, the user will be logged in, granted an active session, and the session data will be persisted on device.
You can listen for successful login events anywhere in the codebase with the stytch.session.onChange() method or useStytchSession hook.
Method parameters
import React, { useCallback } from 'react';
import { useStytch } from '@stytch/react-native';
export const Login = () => {
const stytchClient = useStytch();
const token = new URLSearchParams(window.location.search).get('token');
const resetPassword = useCallback(() => {
stytchClient.passwords.resetByEmail({
token: token,
password: 'x&T$)&W%f#fM7t#C',
session_duration_minutes: 60,
});
}, [stytchClient, token]);
return <button onClick={resetPassword}>Reset Password</button>;
};
RESPONSE
{
"status_code": 200,
"request_id": "request-id-test-b05c992f-ebdc-489d-a754-c7e70ba13141",
"user_id": "user-test-16d9ba61-97a1-4ba4-9720-b03761dc50c6"
}
Strength check
This method allows you to check whether or not the user’s provided password is valid, and to provide feedback to the user on how to increase the strength of their password. All passwords must pass the strength requirements to be accepted as valid.
The strengthCheck method wraps the strength_check Password API endpoint.
Method parameters
import React, { useCallback } from 'react';
import { useStytch } from '@stytch/react-native';
export const Login = () => {
const stytchClient = useStytch();
const strengthCheck = useCallback(() => {
stytchClient.passwords.strengthCheck({
email: '${exampleEmail}',
password: 'x&T$)&W%f#fM7t#C',
});
}, [stytchClient]);
return <button onClick={strengthCheck}>Strength Check</button>;
};
RESPONSE
{
"breach_detection_on_create": true,
"breached_password": false,
"feedback": {
"suggestions": null,
"warning": null,
"luds_requirements": {
"has_digit": true,
"has_lower_case": false,
"has_symbol": false,
"has_upper_case": false,
"missing_characters": 6,
"missing_complexity": 1
}
},
"request_id": "request-id-test-b05c992f-ebdc-489d-a754-c7e70ba13141",
"score": 0,
"status_code": 200,
"strength_policy": "luds",
"valid_password": false
}