Documentation

Capture Phone and Email for Fraud check

Suggest Edits

OneSDK will allow you to capture Phone and Email details and save them onto an individual entity if you need to run Fraud checks on these details.

📘

Fraud device check

Please note, in the following sample codes, we are using a recipe profile that includes a device check.

You need to contact FrankieOne customer support team to set up a recipe in your account with device check included.

There are two ways to capture Phone and Email in OneSDK:

1- Capture Phone and Email using Individual Module

OneSDK Individual module will allow you to set Phone and Email if you already have captured these details from users on your end:


const oneSdkIndividual = oneSdk.individual();

// Set Phone and Email
oneSdkIndividual.setPhoneNumber("+61400000000");
oneSdkIndividual.setEmail("[email protected]");

In the following sample code, we're triggering the device module for fraud detection, setting Phone and Email and then loading eKYC forms for user onboarding.
Please follow the same steps as Quick Start to run this sample code.

<html lang="en">
  <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>oneSdk onboarding</title>
   <script src="https://assets.frankiefinancial.io/one-sdk/v1/oneSdk.umd.js"></script>

  <script>
  async function startOneSdk() {
    const CUSTOMER_ID = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxx-xxxx"
    const CUSTOMER_CHILD_ID = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
    const API_KEY = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

    const tokenResultRaw = await fetch("https://backend.latest.frankiefinancial.io/auth/v2/machine-session", {
            method: "POST",
            headers: {
                "authorization": "machine " + btoa(`${CUSTOMER_ID}:${CUSTOMER_CHILD_ID}:${API_KEY}`),
                "Content-Type": "application/json"
            },
            body: JSON.stringify({
                permissions: {
                    "preset": "one-sdk",
                    "reference": "YOUR_UNIQUE_CUSTOMER_REF"
                }
            })
        });

    const tokenResult = await tokenResultRaw.json();

    const sessionObjectFromBackend = tokenResult;

    const oneSdk = await OneSdk({
      session: sessionObjectFromBackend,
      mode: "development",
      recipe: {
        form: {
          provider: {
            name: 'react',
           // googleApiKey: "YOUR_GOOGLE_MAP_API_KEY"
          },
        }
      }
    });
    oneSdk.on('*', console.log);

    const oneSdkIndividual = oneSdk.individual();
    oneSdkIndividual.setProfileType('devicecheck');

    const device = oneSdk.component("device", {
      activityType: "REGISTRATION",
      // sessionId: "YOUR_CUSTOM_SESSION_KEY",
    });
    device.start();
    
    // Set Phone and Email
    oneSdkIndividual.setPhoneNumber("+61400000000");
    oneSdkIndividual.setEmail("[email protected]");

    const welcome = oneSdk.component("form", {
      name: "WELCOME",
      type: "manual"
    });
    const consent = oneSdk.component("form", {name: "CONSENT"});

    const personal = oneSdk.component("form", {
      name: "PERSONAL",
      type: "manual"
    });

    const document = oneSdk.component("form", {
      name: "DOCUMENT",
      type: "manual",
      numberOfIDs: 1,
    });

    const review = oneSdk.component("form", {
      name: "REVIEW",
      type: "manual",
      verify: true
    });

    const retry = oneSdk.component("form", {
      name: "RETRY",
      type: "manual",
    });

    const result_fail = oneSdk.component("form", {
      name: "RESULT",
      type: "manual",
      state: 'FAIL',
      title: {label:'Max attempt reached'},
      descriptions: [{label:'You have reached all the attempts. Our officer will review your details and get in touch.'}, {label:'Please close the browser'}],
      cta:{label: 'Close'}
    });

    welcome.mount("#form-container");
    welcome.on("form:welcome:ready", () => {
      consent.mount("#form-container");
    });

    consent.on("form:consent:ready", async () => {
      personal.mount("#form-container");
    });

    welcome.on("form:welcome:failed", () => {
      // display error message
    });

    welcome.on("*", (message) => {
      console.log(message);
    });

    personal.on("form:personal:ready", async () => {
      document.mount("#form-container");
    });

    document.on("form:document:back", async ({inputInfo}) => {
      personal.mount("#form-container");
    });


    document.on("form:document:ready", async ({inputInfo}) => {
      review.mount("#form-container");
    });

    let count = 0;
    review.on("form:result:partial", async () => {
      if (count < 2)
      {
        retry.mount("#form-container");
        count+=1;
      }
      else
      {
        result_fail.mount("#form-container");
      }

    });

  }

</script>

<style>
  
</style>

</head>
<body style="background-color: white" onload="startOneSdk()">
  <div id="form-container" style="position:fixed;top: 0;left: 0; width: 100%; height: 100%;"></div>
</body>

2- Capture Phone and Email through Modular Forms

Using OneSDK Forms, you can simply add Phone and Email fields to the Personal screen, so that users will be able to provide the details in the UI.

In the following sample code, we're adding Phone and Email input fields to the UI, as well as triggering the device module for fraud detection.
Please follow the same steps as Quick Start to run this sample code.

<html lang="en">
  <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>oneSdk onboarding</title>
   <script src="https://assets.frankiefinancial.io/one-sdk/v1/oneSdk.umd.js"></script>

  <script>
  async function startOneSdk() {
    const CUSTOMER_ID = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxx-xxxx"
    const CUSTOMER_CHILD_ID = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
    const API_KEY = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

    const tokenResultRaw = await fetch("https://backend.latest.frankiefinancial.io/auth/v2/machine-session", {
            method: "POST",
            headers: {
                "authorization": "machine " + btoa(`${CUSTOMER_ID}:${CUSTOMER_CHILD_ID}:${API_KEY}`),
                "Content-Type": "application/json"
            },
            body: JSON.stringify({
                permissions: {
                    "preset": "one-sdk",
                    "reference": "YOUR_UNIQUE_CUSTOMER_REF"
                }
            })
        });

    const tokenResult = await tokenResultRaw.json();

    const sessionObjectFromBackend = tokenResult;

    const oneSdk = await OneSdk({
      session: sessionObjectFromBackend,
      mode: "development",
      recipe: {
        form: {
          provider: {
            name: 'react',
           // googleApiKey: "YOUR_GOOGLE_MAP_API_KEY"
          },
        }
      }
    });
    oneSdk.on('*', console.log);

    const oneSdkIndividual = oneSdk.individual();
    oneSdkIndividual.setProfileType('devicecheck');

    const device = oneSdk.component("device", {
      activityType: "REGISTRATION",
      // sessionId: "YOUR_CUSTOM_SESSION_KEY",
    });
    device.start();

    const welcome = oneSdk.component("form", {
      name: "WELCOME",
      type: "manual"
    });
    const consent = oneSdk.component("form", {name: "CONSENT"});

    const personal = oneSdk.component("form", {
      name: "PERSONAL",
      type: "manual",
      personal: {
        countries:{
          default:{
            default:{
              fields:[
                {
                  name: 'extraData.email',
                  hide: false
                },
                {
                  name: 'extraData.phone',
                  hide: false
                }
              ]
            }
          }
        }
      }
    });

    const document = oneSdk.component("form", {
      name: "DOCUMENT",
      type: "manual",
      numberOfIDs: 1,
    });

    const review = oneSdk.component("form", {
      name: "REVIEW",
      type: "manual",
      verify: true
    });

    const retry = oneSdk.component("form", {
      name: "RETRY",
      type: "manual",
    });

    const result_fail = oneSdk.component("form", {
      name: "RESULT",
      type: "manual",
      state: 'FAIL',
      title: {label:'Max attempt reached'},
      descriptions: [{label:'You have reached all the attempts. Our officer will review your details and get in touch.'}, {label:'Please close the browser'}],
      cta:{label: 'Close'}
    });

    welcome.mount("#form-container");
    welcome.on("form:welcome:ready", () => {
      consent.mount("#form-container");
    });

    consent.on("form:consent:ready", async () => {
      personal.mount("#form-container");
    });

    welcome.on("form:welcome:failed", () => {
      // display error message
    });

    welcome.on("*", (message) => {
      console.log(message);
    });

    personal.on("form:personal:ready", async () => {
      document.mount("#form-container");
    });

    document.on("form:document:back", async ({inputInfo}) => {
      personal.mount("#form-container");
    });


    document.on("form:document:ready", async ({inputInfo}) => {
      review.mount("#form-container");
    });

    let count = 0;
    review.on("form:result:partial", async () => {
      if (count < 2)
      {
        retry.mount("#form-container");
        count+=1;
      }
      else
      {
        result_fail.mount("#form-container");
      }

    });

  }

</script>

<style>
  
</style>

</head>
<body style="background-color: white" onload="startOneSdk()">
  <div id="form-container" style="position:fixed;top: 0;left: 0; width: 100%; height: 100%;"></div>
</body>

Updated 2 months ago