@xcoobee/payment-sdk
Advanced tools
Comparing version 0.9.0 to 1.0.0
@@ -5,4 +5,4 @@ /** | ||
export var base64 = { | ||
btoa: function (str) { return btoa(str); }, | ||
btoa: function (str) { return btoa(unescape(encodeURIComponent(str))); }, | ||
}; | ||
//# sourceMappingURL=browserBase64.js.map |
@@ -10,4 +10,5 @@ import { PaymentSdkConfigType } from "./types"; | ||
*/ | ||
export declare class BrowserXcooBeePaymentSDK extends XcooBeePaymentSDK { | ||
declare class BrowserXcooBeePaymentSDK extends XcooBeePaymentSDK { | ||
constructor(config: PaymentSdkConfigType); | ||
} | ||
export { BrowserXcooBeePaymentSDK }; |
@@ -70,3 +70,12 @@ var __extends = (this && this.__extends) || (function () { | ||
}(XcooBeePaymentSDK)); | ||
if (!window.XcooBee) { | ||
window.XcooBee = {}; | ||
} | ||
if (!window.XcooBee.BrowserXcooBeePaymentSDK) { | ||
window.XcooBee.BrowserXcooBeePaymentSDK = BrowserXcooBeePaymentSDK; | ||
} | ||
if (!window.XcooBee.XcooBeePaymentSDK) { | ||
window.XcooBee.XcooBeePaymentSDK = XcooBeePaymentSDK; | ||
} | ||
export { BrowserXcooBeePaymentSDK }; | ||
//# sourceMappingURL=browser.js.map |
@@ -21,3 +21,3 @@ /** | ||
*/ | ||
export declare const appUrl = "https://app.xcoobee.com"; | ||
export declare const appUrl = "https://app.xcoobee.net"; | ||
/** | ||
@@ -24,0 +24,0 @@ * @internal |
@@ -26,3 +26,3 @@ /** | ||
*/ | ||
export var appUrl = "https://app.xcoobee.com"; | ||
export var appUrl = "https://app.xcoobee.net"; | ||
/** | ||
@@ -29,0 +29,0 @@ * @internal |
@@ -55,1 +55,9 @@ export declare enum FlexPaymentActions { | ||
export declare type QrType = string | Promise<string>; | ||
/** | ||
* @internal | ||
*/ | ||
declare global { | ||
interface Window { | ||
XcooBee: any; | ||
} | ||
} |
@@ -62,3 +62,3 @@ import { DefaultPayUrlConfigType, ListPayUrlConfigType, ListWithCostPayUrlConfigType, PaymentSdkConfigType, QrGeneratorInterface, QrType } from "./types"; | ||
/** | ||
* Create url to add single item to basket where user can enter amount for this item | ||
* Create url to add single item to basket | ||
* | ||
@@ -71,3 +71,3 @@ * @throws {Error} | ||
/** | ||
* Create QR to add single item to basket where user can enter amount for this item | ||
* Create QR to add single item to basket | ||
* | ||
@@ -74,0 +74,0 @@ * @throws {Error} |
@@ -134,3 +134,3 @@ import { base64 } from "./base64/browserBase64"; | ||
/** | ||
* Create url to add single item to basket where user can enter amount for this item | ||
* Create url to add single item to basket | ||
* | ||
@@ -142,11 +142,11 @@ * @throws {Error} | ||
XcooBeePaymentSDK.prototype.createSingleItemUrl = function (config) { | ||
var userEntry = new Builder({ | ||
var item = new Builder({ | ||
amount: config.amount, | ||
tax: config.tax, | ||
reference: config.reference, | ||
}).makeUserEntry(); | ||
return this.getUrl([userEntry]); | ||
}); | ||
return this.getUrl([item]); | ||
}; | ||
/** | ||
* Create QR to add single item to basket where user can enter amount for this item | ||
* Create QR to add single item to basket | ||
* | ||
@@ -153,0 +153,0 @@ * @throws {Error} |
@@ -21,3 +21,3 @@ /** | ||
*/ | ||
export declare const appUrl = "https://app.xcoobee.com"; | ||
export declare const appUrl = "https://app.xcoobee.net"; | ||
/** | ||
@@ -24,0 +24,0 @@ * @internal |
@@ -29,3 +29,3 @@ "use strict"; | ||
*/ | ||
exports.appUrl = "https://app.xcoobee.com"; | ||
exports.appUrl = "https://app.xcoobee.net"; | ||
/** | ||
@@ -32,0 +32,0 @@ * @internal |
@@ -55,1 +55,9 @@ export declare enum FlexPaymentActions { | ||
export declare type QrType = string | Promise<string>; | ||
/** | ||
* @internal | ||
*/ | ||
declare global { | ||
interface Window { | ||
XcooBee: any; | ||
} | ||
} |
@@ -62,3 +62,3 @@ import { DefaultPayUrlConfigType, ListPayUrlConfigType, ListWithCostPayUrlConfigType, PaymentSdkConfigType, QrGeneratorInterface, QrType } from "./types"; | ||
/** | ||
* Create url to add single item to basket where user can enter amount for this item | ||
* Create url to add single item to basket | ||
* | ||
@@ -71,3 +71,3 @@ * @throws {Error} | ||
/** | ||
* Create QR to add single item to basket where user can enter amount for this item | ||
* Create QR to add single item to basket | ||
* | ||
@@ -74,0 +74,0 @@ * @throws {Error} |
@@ -134,3 +134,3 @@ "use strict"; | ||
/** | ||
* Create url to add single item to basket where user can enter amount for this item | ||
* Create url to add single item to basket | ||
* | ||
@@ -142,11 +142,11 @@ * @throws {Error} | ||
createSingleItemUrl(config) { | ||
const userEntry = new Builder_1.Builder({ | ||
const item = new Builder_1.Builder({ | ||
amount: config.amount, | ||
tax: config.tax, | ||
reference: config.reference, | ||
}).makeUserEntry(); | ||
return this.getUrl([userEntry]); | ||
}); | ||
return this.getUrl([item]); | ||
} | ||
/** | ||
* Create QR to add single item to basket where user can enter amount for this item | ||
* Create QR to add single item to basket | ||
* | ||
@@ -153,0 +153,0 @@ * @throws {Error} |
@@ -12,3 +12,3 @@ { | ||
"license": "Apache-2.0", | ||
"version": "0.9.0", | ||
"version": "1.0.0", | ||
"description": "", | ||
@@ -35,4 +35,4 @@ "homepage": "https://github.com/XcooBee/payment-sdk-js#readme", | ||
"docs": "rm -rf ./docs && npm run docs-node && npm run docs-web", | ||
"build": "ttsc && ttsc -p tsconfig.browser.json", | ||
"build-web-example": "webpack examples/web/web.js -o examples/web/web.bundle.js" | ||
"build": "ttsc && ttsc -p tsconfig.browser.json && npm run minify-web", | ||
"minify-web": "cross-env NODE_ENV=production webpack dist/browser/browser.js -o dist/browser/xcoobee-pay-sdk.min.js" | ||
}, | ||
@@ -61,2 +61,3 @@ "prettier": { | ||
"chai": "^4.2.0", | ||
"cross-env": "^7.0.2", | ||
"husky": "^4.2.5", | ||
@@ -63,0 +64,0 @@ "lint-staged": "^10.2.11", |
142
README.md
@@ -15,2 +15,8 @@ # XcooBee Contactless Payment SDK for JavaScript | ||
## Prerequisites | ||
You will need to setup a XcooBee Payment Request project in order to obtain test and or production campaign codes. You can setup a free [XcooBee Professional](https://app.xcoobee.net/auth/signup?level=professional) Account for this purpose and generate test keys. | ||
During the XcooBee account setup you will also be able to select your payment processor or setup one if needed. | ||
## Installation | ||
@@ -21,3 +27,3 @@ | ||
``` | ||
npm i @xcoobee/payment-sdk easyqrcodejs-nodejs | ||
npm i @xcoobee/payment-sdk | ||
``` | ||
@@ -27,12 +33,135 @@ | ||
For simple use directly download the minified build from our CDN via script tag you can add async option. Placement in HTML header section before `<body>` tag. | ||
``` | ||
npm i @xcoobee/payment-sdk easyqrcodejs | ||
<script src="https://app.xcoobee.net/scripts/sdk/xcoobee-pay-sdk.min.js"></script> | ||
``` | ||
To use without QR generator or to provide your own please use this [link](note.md) | ||
As an alternative you can build the browser yourself and distribute via your own webservers: | ||
``` | ||
npm i @xcoobee/payment-sdk | ||
``` | ||
Follow the install steps with the build step to create distribution for web if needed. For node projects this is not needed. | ||
``` | ||
npm run build | ||
``` | ||
## Documentation | ||
The SDK life cycle is composed of standard class init via a constructor + configuration object followed by using the appropriate method to generate the type of pay URL or QR needed for your operation. | ||
#### Direct Check Out Methods | ||
The direct check out methods allow you to create a URL or QR for payment of one specific amount. It is like an overall total to be paid to you. When end-user interacts (scans QR or clicks URL) they will be asked to make payment for that amount and any existing items in the cart will be removed. | ||
Methods in this group are: | ||
- createPayQr | ||
- createPayQrWithTip | ||
- createPayUrl | ||
- createPayUrlWithTip | ||
#### Cart Methods | ||
Cart methods allow for your users to assemble items in a shopping cart. The overall total is determined by the number and quantity of items in the cart. You can create URL and QR that will **add** to the cart. So you are only adding a single item amount. When end-user interacts (scans QR or clicks URL) this item will be placed in the cart and the user can continue shopping/interacting with your system to add more items before completing a final checkout. | ||
Methods in this group are: | ||
- createMultiSelectQr | ||
- createMultiSelectUrl | ||
- createMultiSelectWithCostQr | ||
- createMultiSelectWithCostUrl | ||
- createSingleItemQr | ||
- createSingleItemUrl | ||
- createSingleSelectQr | ||
- createSingleSelectUrl | ||
- createSingleSelectWithCostQr | ||
- createSingleSelectWithCostUrl | ||
- createExternalReferenceQr | ||
- createExternalReferenceUrl | ||
Please see API documentation for full information on each of these methods. | ||
### Usage | ||
#### Browser Example | ||
```JavaScript | ||
//1. import browser SDK | ||
import { BrowserXcooBeePaymentSDK } from "../../dist/browser/browser"; | ||
//2. init constructor with config object. Use your campaign and form id from XcooBee Project | ||
const sdk = new BrowserXcooBeePaymentSDK({ campaignId: "test", formId: "test" }); | ||
//3. start generating QR or URL using cart or checkout methods | ||
sdk.createPayQr({ amount: 123, reference: "Order" }, 300).then((qr) => { | ||
const img = document.createElement("img"); | ||
img.src = qr; | ||
document.body.appendChild(img); | ||
}); | ||
``` | ||
#### Node Example | ||
```JavaScript | ||
// 1. Require the XcooBee SDK library | ||
const { NodeXcooBeePaymentSDK } = require("@xcoobee/payment-sdk/dist/node/node"); | ||
// 2. initialize your session with campaign and form ids from XcooBee Project | ||
const sdk = new NodeXcooBeePaymentSDK({ campaignId: "test", formId: "test" }); | ||
// 3. generate and use | ||
sdk | ||
.createPayQr({ amount: 123, reference: "Order" }, 100) | ||
.then((base64) => { | ||
//you can render a QR by adding base 64 to src of img tag | ||
console.log(base64); console.log(base64); | ||
}); | ||
``` | ||
#### Example App | ||
- [Walk through creating Ionic App](https://www.xcoobee.com/contactless-payment-for-ionic-framework-in-minutes/) | ||
- [Mobile Ionic App Github](https://github.com/XcooBee/example-payment-sdk-ionic) | ||
#### Roundtrip notification | ||
Since end-users are using their own devices to complete payment you will need to setup an endpoint that can accept notification via webhook post from XcooBee. | ||
This is also done in your XcooBee Payment Request Project UI. | ||
XcooBee will deliver the result of payment processing to that endpoint. | ||
We have full stack example that shows this process in detail in our github repo that you can review for implementation. | ||
If you are using mobile devices you should also consider providing a specific device id that is originating the payment request when initializing the SDK library. You do this by adding the `deviceId` parameter. | ||
```JavaScript | ||
const sdk = new NodeXcooBeePaymentSDK({ campaignId: "test", formId: "test", deviceId: "78hs7yajsdiydsifsd83u78yhisd78yf7dyud" }); | ||
``` | ||
The payment processing information will also contain this device id and allow you push notifications to it using your normal channels. | ||
If you are in development mode, you can also use a polling mechanism where you check the XcooBee network for the processing results. | ||
Please see our event poller example for how this can be done as well as our example full stack app. | ||
### Full API | ||
See the complete documentation for [node](docs/node/README.md) and [browser](docs/browser/README.md). | ||
## Deployment | ||
@@ -55,1 +184,8 @@ | ||
``` | ||
#### Alternative renderers | ||
You can replace the bundled QR code generator with your own renderer. | ||
To use without QR generator or to provide your own please use this [link](note.md) |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
220056
0
187
22
38
2797