# Payment Nonce with COF Enabled

The payment nonce with card on file enabled will be created automatically when you call the collect getNonce method, as long as the following conditions are met:

1. The card on file feature is enabled via collect mount options.

2. The customer accetps the Card Agreement (The checkbox in the payment form must be checked).

3. First name, last name and email address are present in the payment form data or passed in the getNonce options.

# Required Data

To generate the card agreement object, first name, last name and email address are required. You have two options for collecting this data:

• Enable the fields and validation in the mount options when calling collect.mount (all the required data will be collected and verified automatically in the payment form):

collect.mount("collect-container", document, {
  ...
  displayComponents: {
    firstName: true,
    lastName: true,
    emailAddress: true,
  },
  additionalFieldsToValidate: [
    "firstName",
    "lastName",
    "emailAddress",
  ],
});

• Pass the fields in options when calling collect.getNonce (in case you are collecting the required data on your own):

collect.getNonce({
  firstName: "First name",
  lastName: "Last name",
  emailAddress: "email@email.email",
});

# Missing Data - Error Handling

If one of the fields is missing, the card agreement will not be generated and the card will not be saved.

To handle such cases, you can add an event listener for the error event. This is a common event for all Poynt Collect errors, so you also need to check that the error type is card_on_file.

collect.on("error", (event) => {
  console.error(event.data);
  ...
  if (event.data.error?.type === "card_on_file") {
    // you can add any logic you need there
    // e.g. inform the customer that the card has not been saved
  }
});

# Payment Nonce Response

If all conditions are met, you will receive a payment nonce with the card agreement object in the nonce event:

collect.on("nonce", (event) => {
  ...
});