Skip to main content

JS-SDK

Binance JS-SDK is a web development toolkit provided by Binance Mini-program Platform for web developers.

By using the Binance JS-SDK, web developers can directly use Binance-specific capabilities such as oauth, payment, etc. to provide a better web experience for Binance users.

Step1: Create a new app#

We should create a new app in binance mini-program platform, the specific steps can be found in the section MPP Usage

Step2: Import JS-SDK file#

Import the following JS-SDK file on the page where the JS API needs to be called: https://public.bnbstatic.com/static/js/binance-sdk/binance-sdk-v1.0.3.min.js

<script src="https://public.bnbstatic.com/static/js/binance-sdk/binance-sdk-v1.0.3.min.js"></script>

And it is recommended that developers put the js-sdk file on their own CDN so that they can provide users with a uniform and controlled speed experience.

Note: Support for using AMD/CMD

Step3: Permission Verification through bn.init api#

All pages that need to use JS-SDK must inject configuration information first, otherwise other APIs will not be called

Note: The same url only needs to be called once, for the SPA of changing url's web-app, we should call bn.init api every time the url changes)

bn.init({  debug: true, // open debug mode, will log the input value/return value of all the api  clientId: '', // required,unique identifier for developers  ts: '', // required,timestamp of generating signature  nonce: '', // required, the random string of generating signature  signature: '',// required,signature});

Parameters

NameTypeDescription
debugbooleanopen debug mode, will log the input value/return value of all the api
clientIdstringunique identifier for developers
tsstringtimestamp of generating signature
noncestringthe random string of generating signature
signaturestringsignature

the specific signature algorithm can be found in the section Generate JS-SDK signature

Step4: Processing successful verification through bn.ready api#

bn.ready(function(){  // your code});

Note: if bn.init method executed successfully, bn.ready will be called. bn.init is a client-side asynchronous operation, so if the relevant api needs to be called when the page is loaded, the api must be called in the ready function to ensure correct execution.

for apis that are called only when triggered by the user, they can be called directly and do not need to be placed in the ready function.

API call instructions#

All apis are called via a bn object with an object as argument, and all the api will return a Promise<{err: string; payload: object}>, the payload is the return value of api, the err will be empty string if api call success and will be the specific failure reason if api call failed.

API List#

getSystemInfo#

Get the information of current Binance app, for exmaple language, theme, and versions. For more information, please refer to APIs of Mini Program Frameworks

bn.getSystemInfo().then((res) => {  res.payload});

Response

NameTypeDescription
brandstringDevice brand
modelstringDevice model
pixelRationumberDevice's pixel ratio
screenWidthnumberScreen width in px
screenHeightnumberScreen height in px
windowWidthnumberAvailable window width in px
windowHeightnumberAvailable window height in px
statusBarHeightnumberStatus bar height in px
languagestringLanguage set in Binance app
versionstringBinance app version
systemstringOperating system and version
platformstringClient platform
safeAreaObjectSafe area when the screen is in vertical orientation
themestringlight or dark theme current Binance app used

safeArea is composed as follows

NameTypeDescription
leftnumberThe x-coordinate of the top-left corner of the safe area
rightnumberThe x-coordinate of the bottom-right corner to of the safe area
topnumberThe y-coordinate of the top-left corner of the safe area
bottomnumberThe y-coordinate of the bottom-right corner to of the safe area
widthnumberSafe area width in logical pixels
heightnumberSafe area height in logical pixels

getOauthCode#

Use oauth way to get user's inforamtion. For more infomation, please refer to Binance Login (OAuth)

bn.getOuathCode({  state: 'xxxx', // The CSRF token to protect against CSRF (cross-site request forgery) attacks}).then((res) => {  res.payload.code // oauth code  res.payload.state // is same to state of request payload});

Parameters

NameTypeDescription
statusStringThe CSRF token to protect against CSRF (cross-site request forgery) attacks, can be a random string

Response

NameTypeDescription
codeStringThe code can be used to exchange the access_token from the oauth service.
stateStringThe status in the request parameters, developers can validate it with the request one to avoid CSRF attacks

requestPayment#

Start a Binance Pay procedure. For more information, please refer to Binance Pay

bn.requestPayment({  prepayId: 'xxxx', // prepaid order id, the specific details can be found in payment platform  certSn: "",  merchantId: "",  timeStamp: "",  noncestr: "",  paySign: "", // signature of the parameters}).then((res) => {  res.payload.status // '0': pay success, others: pay failed});

Parameters

NameTypeDescription
certSnStringAPI identity key issued by Binance payment system
merchantIdStringThe merchant account id, issued when merchant been created at Binance.
timeStampStringtimestamp of the sign
noncestrStringnonceStr for the sign
prepayIdStringThe value of the prepay_id parameter returned by the unified order placement API
paySignStringSignature. For specific signature schemes, see Binance Pay API Documentation

Response

NameTypeDescription
statusString'0' for paied successfully, and others for paied failed

Note: The prepayId and status are both with type of string, please don't pass a number, otherwise this can cause accuracy problems and thus make the payment fail.