Useing For Vue React Html

| Vue2↓ | | ------------------------------------------------------------ | | Vue3↓ | | React↓ | | Html+JS↓ |

FrameworkSupport

| | | | | :----------------------------------------------------------: | ------------------------------------------------------------ | ------------------------------------------------------------ | | Vue2-Vue3✔ | React16 -18✔ | HTML + JavaScript✔ |

Installing

Package manager

$ npm install @suxhk/sandpay-sdk
$ yarn add @suxhk/sandpay-sdk
$ pnpm add @suxhk/sandpay-sdk

Once the package is installed, you can import the library using import or require approach:

import { 
  queryTradeRecordInfo, // 查询订单信息
  getH5FastPayment, // H5快捷(WAP支付) 06030001 SDK/H5
  getQuickPayment, // 一键快捷 05030001 SDK/H5
  getSandPayTN, // 杉德宝扫码 02040001 SDK/H5
  getWeChatPublicPayment, // 微信公众号 02010002 H5
  getCloudFunction, // H5包装云函数 02010006 H5
  getAliPayUrl, // H5包装支付宝生活号 02020002 H5
  getAliPayCodeUrl // H5包装支付宝码付 02020005 H5
} from '@suxhk/sandpay-sdk'

If you use require for importing

const { queryTradeRecordInfo, ... }  = require('@suxhk/sandpay-sdk')

You can import the library using browser

<script src="https://unpkg.com/@suxhk/sandpay-sdk/dist/index.iife.js"></script>

<script>
  console.log(window.SandpaySdk)
  /**
   * {
   *	getAliPayCodeUrl: ƒ ()
   *	getAliPayUrl: ƒ ()
   *	getCloudFunction: ƒ ()
   *	getH5FastPayment: ƒ ()
   *	getQuickPayment: ƒ ()
   *	getSandPayTN: ƒ ()
   *	getWeChatPublicPayment: ƒ ()
   *	queryTradeRecordInfo: ƒ ()
   * }
   */
</script>

<script>
  // For Example
  window.SandpaySdk.queryTradeRecordInfo({
    tokenId: '2023*****************1234'
  	}).then((result) => {
      console.log('🚀', result)
    }).catch((error) => {
      console.log('❌', error)
    })
</script>

CDN

Using unpkg CDN (ES5 UMD browser):

<script src="https://unpkg.com/@suxhk/sandpay-sdk/dist/index.iife.js"></script>

Using sandpay CDN:

<script src="https://cash.sandpay.com.cn/"></script>

Example

Note CommonJS usage In order to gain the TypeScript typings (for intellisense / autocomplete) while using CommonJS imports with require(), use the following approach:

import { getAliPayCodeUrl } from '@suxhk/sandpay-sdk'

// the `tokenId` is required
getAliPayCodeUrl({ tokenId: '2023*****************1234' })
  .then(result => {
    // handle success
    console.log('🚀', result)
  })
  .catch(error => {
    // handle error
    console.log('❌', error)
  })
  .finally(()=> {
    // always executed
  })

Use Function Config

These are the available config options for making requests. Only the tokenId is required.

{
  // `tokenId`  is returned when the order is ordered
  tokenId: '2023*****************1234'
      
}

Promises

@suxhk/sandpay-sdk depends on a native ES5/6 Promise implementation to be supported.

Handling Errors

Below is a list of potential axios identified error | Function | Definition | ReturnPromises | | ---------------------- | ------------------------------- | --------------- | | getH5FastPayment | H5快捷(WAP支付) 06030001 SDK/H5 | Promise | | getQuickPayment | 一键快捷 05030001 SDK/H5 | Promise | | getSandPayTN | 杉德宝扫码 02040001 SDK/H5 | Promise | | getWeChatPublicPayment | 微信公众号 02010002 H5 | Promise | | getCloudFunction | H5包装云函数 02010006 H5 | Promise | | getAliPayUrl | H5包装支付宝生活号 02020002 H5 | Promise | | getAliPayCodeUrl | H5包装支付宝码付 02020005 H5 | Promise | | queryTradeRecordInfo | 查询订单信息 | Promise |

License

MIT

Thanks