Web SDK Integration

Angular、React and Vue

You can integrate Alchemy Pay into your project using our SDK.

The NPM page for the SDK can be found here: https://www.npmjs.com/package/@alchemy-pay/ramp-sdk

Install

Shell

# Using yarn
$ yarn add @alchemy-pay/ramp-sdk

# Using npm
$ npm install @Alchemy/ramp-sdk

Example

You can view here all available parameters

HTML

<div id="rampView" style="width: 350px;height: 700px"></div> 

JavaScript

import {rampSDK} from '@alchemy-pay/ramp-sdk';

// Definition Ramp SDK
let ramp = new rampSDK({
    secret: '<you-secret-key>', // (Required)
    appId: '<your-app-id>', // (Required)
    environment: '<environment: TEST/PROD>', // (Required)
    containerNode: 'rampView', // (Required) Dom node id
    optionalParameter: {
        crypto: "BTC",//指定币种为BTC
        // .....
        // Parameters Tips:(The exact name and case of the parameter must be used.)
        // For the full list of customisation options check the link above
    },
});

// Initialization Ramp SDK
ramp.init();

Payment Completed

After the user completes the payment, the SDK page will display the payment result and there is a button to return to the merchant. Clicking the button will trigger the following method. You can use this method to close the Web SDK or perform other processing.

JavaScript

// The callback triggered by the return button after the order payment is successful
ramp.on('RAMP_WIDGET_CLOSE',(cb) => {
    // Destroy Ramp SDK
    ramp.close()
})
// or
ramp.on('*',(cb) => {
    // Destroy Ramp SDK
    if(cb.eventName === 'RAMP_WIDGET_CLOSE'){
        ramp.close()
    }
})