Ads3Ads3
广告网络原理
Advertiser 广告主
Publisher 流量主
Quest
  • Telegram
  • Twitter
  • Discord
  • 宣传物料
  • English
  • 简体中文
广告网络原理
Advertiser 广告主
Publisher 流量主
Quest
  • Telegram
  • Twitter
  • Discord
  • 宣传物料
  • English
  • 简体中文
  • Publisher 流量主文档

  • Get Started

    • 流量主功能介绍
    • 获取 BlockdId
    • 广告集成示例
  • Code Integration

    • 流量主对接清单
    • SDK 集成原生广告
    • SDK 集成激励广告
  • Reference

    • Code examples 代码示例
    • SDK 安装
    • 查看数据和收入结算
    • 技术手册

      • SDK API Reference
      • 用户画像
      • API 广告集成
    • 获取 App Id
    • Glossary 术语表

在 React 项目中

SDK 安装

使用 npm 安装 SDK,请运行以下命令:

npm install --save ton-ai-sdk

初始化 SDK

要在 React 项目中初始化 SDK,请在主文件中导入 SDK,例如 App.jsx:

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

然后,在 useEffect 钩子中初始化 SDK:

useEffect(() => {
  // 在测试阶段,设置 debug=true,可以获取到测试广告
  const result = TonAdInit({ appId: 'your-app-id', debug: true })
  console.log('TonAdInit', result)
}, [])

提示

请查看 如何获取 AppId 了解如何获取 AppId

在其他框架中(例如 Vue / Cocos Creator / Native Web)

通过 CDN 引入

要通过 CDN 引入 SDK,请在您的程序入口的 HTML 文件中添加以下脚本标签:

<html lang="zh-CN">
  <head>
     <!-- Add axios CDN -->
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <!-- Add React and ReactDOM -->
    <script src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
    <!-- Import ton-ai-sdk via CDN -->
    <script src="https://cdn.jsdelivr.net/npm/ton-ai-sdk/dist/index.umd.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ton-ai-sdk/dist/index.umd.css" />
  </head>
</html>

初始化 SDK

对于其他框架,您可以在页面完全加载后初始化 SDK:

<script>
  document.addEventListener('DOMContentLoaded', function () {
     if (window.TonAISdk) {
      // 在 DOM 准备好后初始化 TonAd
      // 在测试阶段,设置 debug=true,可以获取到测试广告
      window.TonAISdk.TonAdInit({ appId: 'Your-App-Id', debug: true })
      
     }
  })
</script>
Prev
Code examples 代码示例
Next
查看数据和收入结算