VGS Collect - is a product suite that allows customers to collect information securely without possession of it. VGSCollect iOS SDK allows you to securely collect data from your users via forms without having to have that data pass through your systems. The form fields behave like traditional input fields while securing access to the unsecured data.
You should have your organization registered at VGS Dashboard. Sandbox vault will be pre-created for you. You should use your <vaultId> to start collecting data. Follow integration guide below.
Integration
CocoaPods
CocoaPods is a dependency manager for Cocoa projects. For usage and installation instructions, visit their website. To integrate VGSCollectSDK into your Xcode project using CocoaPods, specify it in your Podfile:
pod'VGSCollectSDK'
Swift Package Manager
The Swift Package Manager is a tool for automating the distribution of Swift code and is integrated into the swift compiler.
Xcode with Swift tools version of 5.3 is required for VGSCollectSDK. Earlier Xcode versions don't support Swift packages with resources.
To check your current Swift tools version run in your terminal:
xcrunswift -version
NOTE: In some cases you can have multiple Swift tools versions installed.
Select VGSCollectSDK and optionally other packages provided with VGSCollectSDK:
Usage
Import SDK into your file
import VGSCollectSDK
Create VGSCollect instance and VGS UI Elements
Use your <vaultId> to initialize VGSCollect instance. You can get it in your organisation dashboard.
Code example
Here's an example
In Action
Customize VGSTextFields...
/// Initialize VGSCollect instance
var vgsCollect = VGSCollect(id: "vauiltId", environment: .sandbox)
/// VGS UI Elements
var cardNumberField = VGSCardTextField()
var cardHolderNameField = VGSTextField()
var expCardDateField = VGSTextField()
var cvcField = VGSTextField()
/// Native UI Elements
@IBOutlet weak var stackView: UIStackView!
override func viewDidLoad() {
super.viewDidLoad()
/// Create card number field configuration
let cardConfiguration = VGSConfiguration(collector: vgsCollect,
fieldName: "card_number")
cardConfiguration.type = .cardNumber
cardConfiguration.isRequiredValidOnly = true
/// Setup configuration to card number field
cardNumberField.configuration = cardConfiguration
cardNumberField.placeholder = "Card Number"
stackView.addArrangedSubview(cardNumberField)
/// Setup next textfields...
}
...
... observe filed states
override func viewDidLoad() {
super.viewDidLoad()
...
/// Observing text fields
vgsCollect.observeStates = { textFields in
textFields.forEach({ textField in
print(textdField.state.description)
if textdField.state.isValid {
textField.borderColor = .grey
} else {
textField.borderColor = .red
}
/// CardState is available for VGSCardTextField
if let cardState = textField.state as? CardState {
print(cardState.bin)
print(cardState.last4)
print(cardState.brand.stringValue)
}
})
}
}
... send data to your Vault
// ...
// MARK: - Send data
func sendData() {
/// handle fields validation before send data
guard cardNumberField.state.isValid else {
print("cardNumberField input is not valid")
}
/// extra information will be sent together with all sensitive card information
var extraData = [String: Any]()
extraData["customKey"] = "Custom Value"
/// send data to your Vault
vgsCollect.sendData(path: "/post", extraData: extraData) { [weak self](response) in
switch response {
case .success(let code, let data, let response):
// parse data
case .failure(let code, let data, let response, let error):
// handle failed request
switch code {
// handle error codes
}
}
}
}
VGSCardTextField automatically detects card provider and display card brand icon in the input field.
Scan Credit Card Data
VGS Collect SDK provides optional card scan solution. It's required to use only Scan modules provided by VGS, which are audited by VGS PCI requirements.
Integrate with Cocoapods
Add 'VGSCollectSDK' alongside with one of scan modules pod:
pod'VGSCollectSDK'# Add one of available scan providerspod'VGSCollectSDK/CardIO'pod'VGSCollectSDK/BlinkCard'
Integrate with Swift Package Manager
Starting with the 1.7.11 release, VGSCollectSDK supports CardIO integration via Swift PM.
To use CardIO add VGSCollectSDK, VGSCardIOCollector packages to your target.
To use BlinkCard add VGSCollectSDK, VGSBlinkCardCollector packages to your target.
Code Example
Here's an example
In Action
Setup VGSCardIOScanController...
class ViewController: UIViewController {
var vgsCollect = VGSCollect(id: "vauiltId", environment: .sandbox)
/// Init VGSCardIOScanController
var scanController = VGSCardIOScanController()
/// Init VGSTextFields...
override func viewDidLoad() {
super.viewDidLoad()
/// set VGSCardIOScanDelegate
canController.delegate = self
}
/// Present scan controller
func scanData() {
scanController.presentCardScanner(on: self,
animated: true,
completion: nil)
}
// MARK: - Send data
func sendData() {
/// Send data from VGSTextFields to your Vault
vgsCollect.sendData{...}
}
}
...
... handle VGSCardIOScanControllerDelegate
// ...
/// Implement VGSCardIOScanControllerDelegate methods
extension ViewController: VGSCardIOScanControllerDelegate {
///Asks VGSTextField where scanned data with type need to be set.
func textFieldForScannedData(type: CradIODataType) -> VGSTextField? {
switch type {
case .expirationDate:
return expCardDateField
case .cvc:
return cvcField
case .cardNumber:
return cardNumberField
default:
return nil
}
}
/// When user press Done button on CardIO screen
func userDidFinishScan() {
scanController.dismissCardScanner(animated: true, completion: { [weak self] in
/// self?.sendData()
})
}
}
Handle VGSCardIOScanControllerDelegate functions. To setup scanned data into specific VGSTextField implement textFieldForScannedData: . If scanned data is valid it will be set in your VGSTextField automatically after user confirmation. Check CradIODataType to get available scand data types.
Don't forget to add NSCameraUsageDescription key and description into your App Info.plist.
Upload Files
You can add a file uploading functionality to your application with VGSFilePickerController.
// ...
// MARK: - Send File
/// Send file and extra data
func sendFile() {
/// add extra data to send request
let extraData = ["document_holder": "Joe B"]
/// send file to your Vault
vgsCollect.sendFile(path: "/post", extraData: extraData) { [weak self](response) in
switch response {
case .success(let code, let data, let response):
/// remove file from VGSCollect storage
self?.vgsCollect.cleanFiles()
case .failure(let code, let data, let response, let error):
// handle failed request
switch code {
// handle error codes
}
}
}
}
Use vgsCollect.cleanFiles() to unassign file from associated VGSCollect instance whenever you need.
Demo Application
Demo application for collecting card data on iOS is here.
To follow VGSCollectSDK updates and changes check the releases page.
Metrics
VGSCollectSDK tracks a few key metrics to understand SDK features usage, which helps us know what areas need improvement. No personal information is tracked.
You can easily opt-out of metrics collection in VGSAnalyticsClient: