SDK 广告集成 高级用法

前置要求

• 已经获取了 ExchangeId，如果没有，请先查看 创建 Exchange 任务

安装 SDK

请参考 SDK 安装 了解如何安装 SDK

原生广告

如果你想在应用中展示原生广告，例如把广告包装成任务，这样对用户体验的干扰较低，我们可以这样做

1. 获取广告

首先要先加载广告，前端调用 SDK GetMultiTonExchangeAd 函数获取广告

import { GetMultiTonExchangeAd } from 'ton-ai-sdk'

const exchangeId = 'your_exchange_id'
const limit = 5
GetMultiTonExchangeAd(exchangeId, limit)
  .then((ads) => {
    if (ads && ads.length > 0) {
      // 广告加载成功，可以在适当的时机展示
    } else {
      // 没有可用的广告
    }
  })
  .catch((error) => {
    console.error('加载广告失败:', error)
  })

提示

我们建议一次性获取多个广告，避免用户对单个广告可能不感兴趣，这样可以提高广告的点击率

ads 对象的结构如下：

{
  "ads": [
    {
      "inExchangeCampaignId": "string", // 目标广告 ID
      "outExchangeCampaignId": "string", // 你当前的广告 ID
      "adFormat": "string", //"image" | "video",
      "icon": "string", // 广告商家图标
      "text": "string", // 广告文案
      "image": "string", // 广告banner图片
      "popupImage": "string", // 广告弹窗图片
      "brandName": "string", // 广告商家名称
      "buttonText": "string", // 按钮文案
      "url": "string", // 广告跳转链接
      "destination": {
        // option: 广告跳转的具体配置
        "actionType": "string",
        "url": "string"
      }
    }
  ]
}

2. 展示广告

然后我们可以把 Ad 中的

• icon
• text
• destination.url

等参数渲染为 Earn 页面的任务，例如：

用户点击任务，您需要调用 SDK OnExchangeAdClick 来处理点击事件 OnExchangeAdClick 将会处理：

1. 广告 url 跳转
2. click 事件上报
3. 广告验证
4. 任务完成

import { OnExchangeAdClick } from 'ton-ai-sdk'
// ad 是 ads 中的一个对象
OnExchangeAdClick(ad, onVerifySuccess=({success:boolean, ad:TonExchangeAdProps,message:string})=>{
  if(success){
    // 验证成功，可以设置任务为完成状态,并且发送任务奖励
    // sendReward()
  }else{
    // 验证失败，可以提示用户重试
  }
})

提示

onVerifySuccess 后，用户不会继续看到该广告