|
Table of Contents
SubscriptionBridge.JSOverviewSubscriptionBridge.JS is a JavaScript API that allows you to embed hosted payment forms into any web site. This gives you a seamless look & feel of the developer's API, but with simplicity and PCI compliance of our hosted payment pages. What kind of forms may I embed into my web site?
Online DemoClick here to open our online demos. You will see a demo of:
Getting StartedHere's what we recommend you do:
ParametersOnce you have downloaded the code samples, you'll want to modify some of the parameters. The following chart contains a list of all available parameters. Onetime Payment Parameters
Update Billing Parameters
Understanding the CodeThe code samples contain a mix of JavaScript, HTML, and - in some cases - server code. Don't worry, there are only a few bits of server code for encrypting sensitive information. The following section will take you step-by-step through the process of re-creating the sample files. 1. We add the SB JavaScript library to the web page directly above the closing HTML body tag. (e.g. </body>). Example: <script type="text/javascript" language="javascript"> (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.src='//www.subscriptionbridge.com/v2/subscriptionbridge.min.js';g.onreadystatechange=SubscriptionBridge;g.onload=SubscriptionBridge;s.parentNode.insertBefore(g,s)}(document,'script')); </script> </body> 2. Second, we add some JavaScript to create the form. We will go step by step and then show you a complete example at the end. Let's break it down… It all starts with a basic JavaScript tags: <script type="text/javascript" language="javascript"> ... </script> Next, we add the function that will load our form: var _noconflict = 0; var SubscriptionBridge = function() { if (_noconflict==0) { ... } _noconflict = 1; }; Next, we specify the type of form we want to create. In this example, we will create a form that will allow visitors to the page to post a one-time payment related to their subscription (e.g. add extra space to an online file backup service): var Transaction = new OnetimePayment(); Next, we add the parameters: Transaction.URL = "https://www.subscriptionbridge.com/v2/OnetimePayment"; Transaction.ID = "mydiv"; Transaction.Guid = "UVAXSW919201103417"; Transaction.Description = 'Add 5GB of Storage'; Transaction.Amount = '5.00'; Transaction.Currency = 'EUR'; Transaction.Language = 'en'; Transaction.ReturnURL = 'https://www.my_domain.com/v2/onetimepayment.php'; Transaction.Signature = 'you cannot tamper with this form'; Transaction.IsProrated = 'False'; Transaction.IsRecurring = 'False'; Transaction.PassThrough = 'val | val2 | val3 | val4'; Lastly, we call the Open method to load the form into our “div”. Transaction.Open(); When we put that all together, we get something that looks like this: <script type="text/javascript" language="javascript"> var _noconflict = 0; var SubscriptionBridge = function() { if (_noconflict==0) { var Transaction = new OnetimePayment(); Transaction.URL = "https://www.subscriptionbridge.com/v2/OnetimePayment"; Transaction.ID = "mydiv"; Transaction.Guid = "UVAXSW919201103417"; Transaction.Description = 'Add 5GB of Storage'; Transaction.Amount = '5.00'; Transaction.Currency = 'EUR'; Transaction.Language = 'en-US'; Transaction.ReturnURL = 'https://www.my_domain.com/receipt.php'; Transaction.Signature = 'my_signature'; Transaction.IsProrated = 'False'; Transaction.IsRecurring = 'False'; Transaction.PassThrough = 'val | val2 | val3 | val4'; Transaction.Open(); } _noconflict = 1; }; </script> 3. We add a secure signature to tamper-proof the form. This step is not required for checkout forms, but is required for editing payments and onetime payments. That means that no programming is required to embed a “Checkout” form into a web-site. However, to embed an “Update Billing Information” form requires some basic knowledge of a programming language such as PHP, ASP.NET, Ruby, etc. The signature is an encrypted hash of the form values in the following format: Transaction.Signature = 'my_signature'; View the next section for information creating the signature. If it seems complicated, don't worry. Our team is standing by to lend you a hand. Creating the SignatureThe signature is a HMAC/SHA hash of the amount and return URL separated by a pipe. e.g. Amount|Return_URL After you form the signature you must encrypt it using HMAC/SHA. You will find encryption samples for PHP, .NET, and Classic ASP in the samples section. Note, if you are using the SubscriptionBridge API this is the same method used to create your SB API token. Here are some examples for creating the Signature: Classic ASP var_Amount = "1.00" var_APIKey = "82F3BB4C92D2412694661A28A8454E6" var_Hash = var_Amount & "|" & "https://www.my_domain.com/receipt.asp" var_Signature = hex_hmac_sha1(var_APIKey, var_Hash) |
Contact us for more information, or head over to the free trial sign-up form to give SubscriptionBridge a try! Sign Up Free