template-demo/node_modules/@jdmini/api/README.md

5.4 KiB
Raw Permalink Blame History

安装/更新

1、终端使用命令安装 npm 包

npm install --save @jdmini/api@latest
npm install --save @jdmini/components@latest

2、在小程序开发者工具中菜单选择工具 -> 构建 npm

使用

import {
  onLoginReady,
  waitLogin,

  injectApp,
  injectPage,
  injectComponent,
  hijackApp,
  hijackAllPage,

  gatewayHttpClient,
  baseHttpClient,
  apiHttpClient,
  HttpClient,

  adManager,
} from '@jdmini/api'

waitLogin/onLoginReady - 确保登录完成

  • 同步的写法
async function onLoad() {
  await waitLogin()
  // 此处代码将在已登录或登陆完成后执行。请求将自动携带Token
  await gatewayHttpClient.request('/xxx', 'GET', {})
}
  • 异步的写法
function onLoad() {
  onLoginReady(() => {
    // 此处代码将在已登录或登陆完成后执行。请求将自动携带Token
    gatewayHttpClient.request('/xxx', 'GET', {})
  })
}

injectApp - 向App注入基础代码

  • 注入之后实现自动登录、广告初始化等功能
// app.js
App(injectApp()({
  // 业务代码
  onLaunch() {
    
  }
}))

injectPage - 向Page注入基础代码

  • 注入之后实现页面自动统计、自动展示插屏广告以及激励视频广告的调用支持
  • 参数:
    • showInterstitialAd: 是否自动展示插屏广告
// pages/xxx/xxx.js
Page(injectPage({
  showInterstitialAd: true
})({
  // 业务代码
  onLoad() {

  }
}))

injectComponent - 向Component注入基础代码

  • 适用于使用Component构造页面的场景
  • 注入之后实现页面自动统计、自动展示插屏广告以及激励视频广告的调用支持
  • 参数:
    • showInterstitialAd: 是否自动展示插屏广告
// pages/xxx/xxx.js
Component(injectComponent({
  showInterstitialAd: true
})({
  // 业务代码
  methods: {
    onLoad() {

    }
  }
}))

hijackApp - 劫持全局App方法注入基础代码

  • 在不方便使用injectApp时使用如解包后代码复杂难以修改App调用
  • 此方法会修改全局App方法存在未知风险使用时请进行完整测试
  • 不可与injectApp同时使用
// app.js
hijackApp()

hijackAllPage - 劫持全局Page方法注入基础代码

  • 在不方便使用injectPage/injectComponent时使用如解包后代码复杂难以修改Page/Component调用
  • 此方法会修改全局Page方法并影响所有的页面存在未知风险使用时请进行完整测试
  • 参数同injectPage/injectComponent方法不可与这些方法同时使用
// app.js
hijackAllPage({
  showInterstitialAd: true
})

gatewayHttpClient - 网关API调用封装

  • 同步的写法
async function onLoad() {
  try {
    // 网关请求。参数路径、方法、数据、其他选项如headers、responseType
    const data = await gatewayHttpClient.request(path, method, dataoptions)

    // 头像上传。参数:文件路径
    const data = await gatewayHttpClient.uploadAvatar(filePath)

    // 文件上传。参数:文件路径、数据
    const data = await gatewayHttpClient.uploadFile(filePath, data)
    
    // 文件删除。参数文件ID
    const data = await gatewayHttpClient.deleteFile(fileId)
  } catch(err) {
    // 响应HTTP状态码非200时自动showToast并抛出异常
  }
}
  • 所有方法均支持异步的写法
function onLoad() {
  gatewayHttpClient.request('/xxx')
    .then(data => {
      console.log(data)
    })
    .catch(err => {})
}

baseHttpClient/apiHttpClient - 为老版本兼容保留,不推荐使用

HttpClient - API底层类用于封装自定义请求

  • 示例:封装一个百度的请求客户端,并调用百度搜索
const baiduHttpClient = new HttpClient({
  baseURL: 'https://www.baidu.com',
  timeout: 5000,
});

baiduHttpClient.request('/s', 'GET', { wd: '测试' }, { responseType: 'text' })
  .then(data => console.log(data))

adManager - 广告管理器

  • 确保广告数据加载完成,支持同步/异步的写法
// 同步的写法
async function onLoad() {
  await adManager.waitAdData()
  // 此处代码将在广告数据加载完成后执行
  await adManager.createAndShowInterstitialAd()
}

// 异步的写法
function onLoad () {
  adManager.onDataReady(() => {
    // 此处代码将在广告数据加载完成后执行
    adManager.createAndShowInterstitialAd()
  })
}
  • 广告数据
// 格式化之后的广告数据对象,如{banner: "adunit-f7709f349de05edc", custom: "adunit-34c76b0c3e4a6ed0", ...}
const ads = adManager.ads

// 友情链接顶部广告数据
const top = adManager.top

// 友情链接数据
const link = adManager.link
  • 创建并展示插屏广告
function onLoad() {
  adManager.createAndShowInterstitialAd()
}
  • 创建并展示激励视频广告
    • 传入当前页面的上下文this返回用户是否已看完广告
    • 由于微信的底层限制需要先在调用的页面上进行injectPage注入且该方法必须放在用户的点击事件里调用
    • 使用示例可参考jdwx-demo
// 同步的写法
page({
  async handleClick() {
    const isEnded = await adManager.createAndShowRewardedVideoAd(this)
  }
})

// 异步的写法
page({
  handleClick() {
    adManager.createAndShowRewardedVideoAd(this).then((isEnded) => {
      
    })
  }
})