Getting Started
LIMEPAY Web-Library
Set up your Client
The LimePay Web-Library requires a payment form to be imported in your UI.
1. Install and Connect to the API
Install the Web-Library:
1
npm install limepay-web
Copied!
Connect to the API:
1
const LimePayWeb = require('limepay-web');
2
const LimePay = await LimePayWeb.connect(LimePayWeb.Environment.Sandbox);
Copied!
1. Setup the Checkout form
Add the following HTML to your page:
1
<form id="checkout-form" onsubmit="process()">
2
<!--Field for CC number-->
3
<label for="card-number">Card Number</label>
4
<div id="card-number" data-bluesnap="ccn"></div>
5
<div id="card-logo">
6
<img src="https://files.readme.io/d1a25b4-generic-card.png" height="20px">
7
</div>
8
<span class="helper-text" id="ccn-help"></span>
9
​
10
<!--Field for CVV number-->
11
<label for="cvv">CVV</label>
12
<div id="cvv" data-bluesnap="cvv"></div>
13
<span class="helper-text" id="cvv-help"></span>
14
15
<!--Field for Exp Date-->
16
<label for="exp-date">Exp. (MM/YY)</label>
17
<div id="exp-date" data-bluesnap="exp"></div>
18
<span class="helper-text" id="exp-help"></span>
19
20
<button type="submit" id="submit-button">Pay Now</button>
21
</form>
Copied!
NOTE: Since v0.3.6 you are not required to add the form HTML element. For more information visit the Web-Library Changelog.
2. Load Payment
To start up, the Web-Library needs a lime token retrieved by your LimePay SDK when you create Payment. To see how to create Payment, please follow Set up your Server guide.
Once you have created a payment and received the lime token, use it to load the payment:
1
LimePay.FiatPayments.load(limeToken)
2
.then(result => {
3
const fiatPayment = result;
4
});
Copied!
3. Sign the Transactions
Your user has to sign the Ethereum transactions that have to be executed:
1
fiatPayment.signWithLimePayWallet(walletPassword); // returns Promise<>
Copied!
NOTE: The example above shows how you can sign transactions for a shopper that uses LimePay Wallets. More information on the other ways you can sign your user's transactions can be found in the Web-Library Documentation.
4. Submit the Payment for processing
Once your user fills his Credit/Debit Card information and signed the transactions, you can submit the payment for processing.
1
fiatPayment.process(cardHolderInformation, signedTransactions)
2
.catch(error => {});
Copied!
You have successfully submitted the payment for processing once the
.process promise resolves.That's it!
Congrats! You have successfully provided your users with the ability to execute Ethereum transactions with their Credit/Debit card.
Last modified 2yr ago