> ## Documentation Index
> Fetch the complete documentation index at: https://stytch.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Integrate OTPs via the API

> Build SMS one-time passcode signup and login flows with the Consumer API.

Integrate Stytch one-time passcodes as your authentication solution.

<Steps>
  <Step title="Build your UI for SMS login">
    Here's an example of an authentication flow. One screen accepts the user's phone number and the other accepts their one-time passcode.

    <img src="https://mintcdn.com/stytch-34ca0595/ujkFjtNfcCtlcK2E/images/consumer/from-old-docs/enter-phone-number.png?fit=max&auto=format&n=ujkFjtNfcCtlcK2E&q=85&s=822234dfd5f21d887548c7151bce8739" alt="Enter phone number" width="978" height="968" data-path="images/consumer/from-old-docs/enter-phone-number.png" />

    <img src="https://mintcdn.com/stytch-34ca0595/ujkFjtNfcCtlcK2E/images/consumer/from-old-docs/enter-passcode.png?fit=max&auto=format&n=ujkFjtNfcCtlcK2E&q=85&s=47262a66632f5a1528f0a8761e0d1941" alt="Enter passcode" width="978" height="968" data-path="images/consumer/from-old-docs/enter-passcode.png" />
  </Step>

  <Step title="Login or create user">
    The LoginOrCreateUserBySMS endpoint will be used to log in or sign up a user. This request will send a one-time passcode to the provided phone number. By default, the code will expire in 2 minutes. You can alter the expiration with the ExpirationMinutes request field. If the phone number isn't associated with a user yet, a user will be created. If the user\_created attribute in the response is true, save the user ID and phone ID from the response. We recommend saving these IDs in new columns of your users table or within a new table linking your users with their Stytch IDs.

    ```js theme={null}
    const stytch = require("stytch")

    const client = new stytch.Client({
        project_id: "PROJECT_ID",
        secret: "SECRET",
        env: stytch.envs.test,
      }
    );

    const params = {
        phone_number: "+12025550162"
    };
    client.otps.sms.loginOrCreate(params)
        .then(resp => {
            console.log(resp)
        })
        .catch(err => {
            console.log(err)
        });
    ```
  </Step>

  <Step title="Authenticate one-time passcode">
    The AuthenticateOTP endpoint will be used in conjunction with all LoginOrCreateUserBySMS requests. The user should be prompted to enter the one-time passcode sent to them via SMS. After the user enters their code, send an AuthenticateOTP request with the code along with the phone ID used. If the response is a 200, the user is verified and can be logged in. If you'd like to keep this user logged-in for a while, include "session\_duration\_minutes": 60 (an hour, for example). Check out the [session management guide](/consumer-auth/manage-sessions/overview) to learn how to handle the session.

    ```js theme={null}
    const stytch = require("stytch")

    const client = new stytch.Client({
        project_id: "PROJECT_ID",
        secret: "SECRET",
        env: stytch.envs.test,
      }
    );

    const params = {
        method_id: "phone-number-test-d5a3b680-e8a3-40c0-b815-ab79986666d0",
        code: "123456"
    };
    client.otps.authenticate(params)
        .then(resp => {
            console.log(resp)
        })
        .catch(err => {
            console.log(err)
        });
    ```
  </Step>
</Steps>
