How to Integrate the SDK

Quickstart from Dashboard

You should have your organization registered at VGS Dashboard. Sandbox vault will be pre-created for you. You should use your vault id to start collecting data. Follow integration guide below.

Integrate VGSCollectSDK into Your iOS Project

CocoaPods

Step 1: Install and Configure the SDK

Install the latest version of CocoaPods.

sudo gem install cocoapods

If you don’t have an existing Podfile, run the following command to create one:

pod init

Add VGSCollectSDK pod to your Podfile:

pod 'VGSCollectSDK'

Run the following command:

pod install

Use the .xcworkspace file to open your project in Xcode, instead of the .xcodeproj file, from here on out.

Step 2: Configure Your App

To initialize VGSCollect you have to set your vault id and Environment type:

import UIKit
import VGSCollectSDK

class ViewController: UIViewController {

  var vgsCollect = VGSCollect(id: "<your-vault-id>", environment: .sandbox)

  // VGS UI Components
  var cardNumber = VGSCardTextField()
  var expCardDate = VGSTextField()
  var cvcCardNum = VGSTextField()
}

Note

  • All View Controllers that use VGS Collect UI components need VGSCollect instance initialization.
  • All VGSCollect instances will be work separately.
  • All VGSCollect instances can be configured differently.

Configure UI Components and Collect Data

There are two-steps in the integration process: with server-side and client-side actions.

1. Configuring VGSCollect UI Components

func setupElements() {
    let cardConfig = VGSConfiguration(collector: vgsCollect, fieldName: "cardNumber")
    cardConfig.placeholder = "card number"
    cardConfig.isRequired = true
    cardConfig.type = .cardNumber

    cardNumber.configuration = cardConfig
    view.addSubview(cardNumber)

    button.addTarget(self, action: #selector(sendData(_:)), for: .touchUpInside)
  }

2. Securely collecting and sending information

Use vgsCollect.submit(_:) to collect data from VGSCollect UI Components and send it to your Vault:

func sendData(_ sender: UIButton) {
    // extra information will be sent together with all sensitive information from VGSCollect UI Components
    var extraData = [String: Any]()
    extraData["cardHolderName"] = "Joe Business"

    // send data
    vgsCollect.submit(path: "/post", extraData: extraData, completion: { (json, error) in
        if error == nil, let json = json {
            // parse response data
        } else {
            // handle errors
        }
    })
}