Getting Started


Documentation for integrating One, Inc.’s PCI compliant payment widget into an existing web-based application.



Documentation for processing payments with One, Inc.

Start integrating with a few simple steps.

Payment Widgets

load javaScript api

reserve DOM element

Get session id

Call JavaScript function


Payment Processing

RESTful API Example

Load the PortalOne™ JavaScript API

To load the PortalOne™ JavaScript API, you must use a script tag like the one in the following example: 
<script async defer src="https://testportalone.processonepayments.com/GenericModal/Cdn/PortalOne.js" type="text/javascript"></script>
The URL contained in the script tag is the location of a JavaScript file that loads all of the symbols and definitions you need to use the PortalOne™ JavaScript API. The async attribute instructs the browser to render the rest of your website while the PortalOne JavaScript API loads.

Reserve DOM element and define initialize callback

For the portal to display on a web page, you must reserve a spot for it. Commonly this is done by creating a named div element and obtaining a reference to this element in the browser's document object model (DOM). 
<div id="portalOneContainer"></div>

Get Session Id from PortalOne REST API

In order to interact with PortalOne you must first obtain a secure Session Id, this ensures only authenticated applications are allowed to access PortalOne. To obtain a Session Id, you need to send a Http POST request to PortalOne and include your issued authentication key in the body of the request. Feel free to reach out to us to obtain your personal PortalOne™ AuthenticationKey. 
using System.Collections.Generic;
using System.Net.Http;
using Newtonsoft.Json;

private static readonly HttpClient client = new HttpClient();

var portalOneUrl = new Uri("https://testportalone.processonepayments.com/GenericModal/SessionKey/Create");
var portalOneAuthenticationKey = "PortalOne Authentication Key";
var values = new Dictionary<string, string>
    {
        { "portalOneAuthenticationKey", portalOneAuthenticationKey }
    };

var content = new FormUrlEncodedContent(values);
var response = client.PostAsync(portalOneUrl.ToString(), content).Result;
var responseString = response.Content.ReadAsStringAsync().Result;
var responseObject = JsonConvert.DeserializeObject<dynamic>(responseString);
var isSuccesful = responseObject.IsSuccesful;
var sessionId = responseObject.SessionKey;

Console.WriteLine("Session Id: " + sessionId);


class SessionIdRequest {
    public $PortalOneAuthenticationKey = "PortalOne Authentication Key";
}

$sessionIdRequest = new SessionIdRequest();

$url = 'https://testportalone.processonepayments.com/GenericModal/SessionKey/Create';
$ch = curl_init( $url );
$payload = json_encode($sessionIdRequest);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt( $ch, CURLOPT_POSTFIELDS, $payload );
curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/json'));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_HEADER, 1);

$portalOneResponse = curl_exec ($ch);

$headerSize = curl_getinfo($ch, CURLINFO_HEADER_SIZE);
$header = substr($processOneResponse, 0, $headerSize);
$body = substr($processOneResponse, $headerSize);
curl_close ($ch);

echo $body;


var request_body = {
        "PortalOneAuthenticationKey": "PortalOne Authentication Key"
    };

var request_options = {
    method: 'POST',
    uri: 'https://testportalone.processonepayments.com/GenericModal/SessionKey/Create',
    json: true,
    body: request_body
};

var request = require('request');
var request_promise = require('request-promise');
var response = await request_promise(request_options);
var sessionId = response.SessionKey;
Use the following code snippet as an example to quickly create a request object in your application. Refer to Full Documentation for more details.

Call JavaScript function to open modal

In order to invoke the Make Payment modal window, you first initialize the library and then simply call the makePayment function with required parameters. See full documentation for reference to the various events exposed by the library. 
$('#portalOneContainer').portalOne();
$('#portalOneContainer').data('portalOne')
    .makePayment({
        'paymentCategory': 'CreditCard',
        'feeContext': 'PaymentWithFee',
        'minAmountDue': '12.00',
        'accountBalance': '120.00',
        'billingZip': '95630',
        'billingAddressStreet': '602 Coolidge Dr., Folsom, CA',
        'policyHolderName': 'John Smith',
        'referenceNumber': 'POL330701-02',
        'sessionId': 'Your Session Id From Previous Step'
    });

ProcessOne REST API Example

To test the ProcessOne™ RESTful API, please reach out to us to obtain your ProcessOne™ AuthenticationKey. 
public void Charge()
{
    Console.WriteLine("Executing credit card charge operation");

    // Set an actual ProcessOne RestAPI url
    var apiUri = Settings.Default.ProcessOneApiUrl;

    var chargeRequest = new ChargeCreditCardRequest
    {
        // Set your ProcessOne Authentication Key
        AuthenticationKey   = Settings.Default.AuthenticationKey,
        Amount = 1,                             
        CreditCard = new CreditCardDetails
        {
            Number = "4444444444444448",        
            ExpirationMonth = 12,               
            ExpirationYear = 2020,
            Holder = new Customer
            {
                Name = "Holder Name",
                Address = "Holder Billing Address",
                Zip = "12345"
            },
            ValidationValue = "123"
        },
        ClientReferenceData = new ClientReferenceData
        {
            ClientReferenceData1 = "POL12345"
        }
    };

    var result = new ProcessOneApi(apiUri)
        .CreditCard
        .Charge(chargeRequest);

    Console.WriteLine("Execution result code: {0}", result.ResponseCode);
    Console.WriteLine("Message: {0}", result.Message);
    Console.WriteLine("Transaction Id: {0}", result.TransactionId);
}

class Customer {
	public $Name = "Holder Name";
	public $Address = "Holder Billing Address";
	public $Zip = "12345";
}

class ClientReferenceData {
	public $ClientReferenceData1 = "POL12345";
}

class CreditCardDetails {
	public $Number = "4444444444444448";
	public $ExpirationMonth = 12;
	public $ExpirationYear = 2020;
	public $Holder = null;
}

class ChargeCreditCardRequest {
	public $AuthenticationKey = "AuthenticationKey";
	public $Amount = 1;
	public $CreditCard = null;
	public $ClientReferenceData = null;
}

$chargeRequest = new ChargeCreditCardRequest();
$chargeRequest -> CreditCard = new CreditCardDetails();
$chargeRequest -> CreditCard -> Holder = new Customer();
$chargeRequest -> ClientReferenceData = new ClientReferenceData();

$url = 'ProcessOne Url';
$ch = curl_init( $url );
$payload = json_encode($chargeRequest);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt( $ch, CURLOPT_POSTFIELDS, $payload );
curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/json'));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_HEADER, 1);

$processOneResponse = curl_exec ($ch);

$headerSize = curl_getinfo($ch, CURLINFO_HEADER_SIZE);
$header = substr($processOneResponse, 0, $headerSize);
$body = substr($processOneResponse, $headerSize);
curl_close ($ch);

echo $body;

<script src="../Scripts/jquery-1.12.4.min.js"></script>
<script src="../Scripts/processOneApi.js"></script>
<script>
    var application = {
        config: {
            processOneUrl: 'http://processone/api/',
            processOneAuthenticationKey: 'Authentication Key',
        }
    }

    var creditCardChargeResponse;
    $.processOneApi(application.config.processOneUrl)
        .creditCard
        .charge({
            authenticationKey: application.config.processOneAuthenticationKey,
            amount: 1,
            creditCard: {
                number: '4012000033330026',
                validationValue: '123',
                expirationYear: 2020,
                expirationMonth: 12,
                holder: {
                    name: 'Customer',
                    zip: '12345'
                }
            }
        })
        .done(function (result) {
            creditCardChargeResponse = result;
            console.log("creditcard charged");
            // process the result
            console.log(result);
        })
        .fail(function (result) {
            // process the result
            console.error(result);
        });
</script>
Use the following code snippet as an example to quickly create a request object in your application. Refer to Full Documentation for more details.