Documentation
AcademyCommunitySign In
  • 👋Overview
  • 💙Platform Features
  • Getting started
    • 🚪Signing up & Logging in
      • 👤Profile Settings
    • 🎛️App Management
    • ✴️Templates to Start With
      • Basic Template (Blank app)
      • CRM Template
    • 👨‍🎓Learning Directual
      • 👨‍🏫Webinars
  • Data base
    • Data Structures
      • System Structures
    • Data Types
      • Markdown Cheat Sheet
      • Indexing Fields
      • Formatting Date/Time
    • Directual Query Language (DQL)
    • Import and Export
      • Import API
    • File Storage
      • API for File Storage
  • API and integraions
    • API-Endpoints
      • Advanced techniques for GET and POST requesting
        • Paging for GET-requests
        • Dynamic sorting for GET-requests
        • Custom filtering parameters for GET-requests
        • Advanced filtering for GET-requests
        • Formatting response for GET-request
        • Fields validation for POST-requests
        • Synchronic scenarios for POST-requests
        • Cross-Origin Resource Sharing CORS
      • API testing and debugging
      • Coding mode (raw mode) in filters
      • Swagger specification
    • Webhooks
    • Authentication API
      • Login/password
      • OpenID connect
      • Facebook oAuth
      • Google oAuth
    • Security Features
    • Other Integrations
      • OpenAI
      • Integration Hubs
        • Zapier
      • Telegram
        • Telegram: Advanced Techniques
      • Email
        • SMTP
        • Gmail
      • Twilio SMS
      • Airtable
      • Coupler.io
      • Other No-Code Tools
        • Bubble.io
          • Authorization
          • Displaying Data from Directual on Bubble
        • Adalo
        • UI bakery
        • Tilda
        • AppGyver
  • App interface
    • Web-App Builder basics
    • Web-App Settings
      • General web-app settings
      • Main menu
      • Creating a logotype
      • Web-App color scheme
      • Web-app typography
      • White Labeling
      • Web-App Icon
      • Custom Domain
      • Custom code
    • Setting Up Page Layout
      • Subpages and URL Parameters
    • Components
      • Multistep Form
      • Cards
      • Table
      • Kanban
      • Chart
      • Markdown text
      • HTML code
      • Hint
      • Link Button
      • Video
      • Form (outdated)
    • Embedding Pages
  • Scenarios
    • Understanding Directual Scenarios
      • Directual Event Model
    • Event-Based Triggers
    • Scheduled Triggers
      • Cron Format
    • Synchronous Scenarios
    • Editing Scenarios
      • System Steps
        • Start step
        • Delay step
        • Comment step
        • Catch error step
        • Link scenario step
        • Exit step
      • Action steps
        • Edit object step
        • Create object step
        • Search objects step
        • JSON step
        • Delete object step
        • Run report step
        • Generate document step
        • JS SDK step
      • Condition steps
        • Condition step
        • A/B test step
        • JS SDK condition step
      • Integration steps
        • HTTP-request step
        • Zapier step
        • Telegram step
        • API response
        • Email step
        • SQL-request step
        • Queue step
    • Using Variables
      • Global Variables
      • Context Variables (scenario parameters)
    • Testing and Debugging
    • System Scenarios
    • Advanced Scenario Settings
  • Template system
    • Templating Principles
      • Templating Techniques for Scenarios
      • Templating Techniques for Web-pages
    • Coding Mode (evaluating as a JS-expression)
    • Comparison Component
      • Regular Expressions
    • Tips for Dealing with Data
  • Telegram
    • Telegram
  • Plugins
    • 🔌Using Plugins
      • Scenario Steps Plugins
      • Web Plugins
      • User Authentication Plugins (Not Web3)
        • TMA (Telegram Mini App)
        • Google OAuth Plugin
        • Facebook OAuth Plugin
        • Open ID Auth Plugin
      • Blockchain (Web3)
        • TON (The Open Network)
        • Polygon
        • Ethereum
        • NEAR Protocol
        • NFT and Smart-Contracts
        • MetaMask Wallet
        • WalletConnect
      • WebSockets (Socket.IO)
    • 🪚Developing Plugins
      • Developing Scenario Plugins
      • Developing Web-plugins
        • Example: Using Chart.js in Directual
        • Example: Building Simple Form
        • Example: TON plugin
  • Teams
    • Teams
    • Sandbox Apps
  • JavaScript SDK
    • Directual + JavaScript SDK: The Basics
    • Internal $D Methods
    • Using Google Sheets
    • JS SDK: Examples
  • Reports
    • Reports
  • App life cycle management
    • App Versions
  • Directual 💙 React JS
    • Directual + React JS
  • Pricing and billing
    • 💳How Billing Works
    • 🎁Promo Codes
    • Pricing Plans for Apps
    • Team Pricing Plans
    • How we count requests and operations
    • On-Demand Resource Consumption
    • 🤝Affiliate Program
  • Hire a Directual expert
    • 🏆Certification
    • 🤝Matching with Experts
    • 🏦Escrow service
  • Security and stability
    • 🛡️Public Cloud
    • Platform Architecture
  • Support
    • 📬Contact Directual
  • Directual step-by-step
    • Public Development Roadmap
      • Step 0: Planning App Architecture
      • Step 1: Requesting Features
      • Step 2: Approving Features
      • Step 3. Upvoting Features
      • Step 4. Watching Features
    • Weather Forecast App
    • Web3 Marketplace on Polygon
    • Transferring NFT
Powered by GitBook
On this page
  • What is TON?
  • Directual TON plugin
  • Step 1. Install free TON plugin from the Marketplace in your Directual app
  • Step 2. Add a webhook for notifications
  • Step 3. Exploring the scenario plugin
  • Step 4. Exploring web-plugin
  • Step 5. Processing transactions

Was this helpful?

  1. Plugins
  2. Using Plugins
  3. Blockchain (Web3)

TON (The Open Network)

💎 Probably, the best blockchain over there

PreviousBlockchain (Web3)NextPolygon

Last updated 11 months ago

Was this helpful?

What is TON?

(TON) is a decentralized and open internet platform made up of several components. These include: TON Blockchain, TON DNS, TON Storage, and TON Sites. TON Blockchain is the core protocol that connects TON’s underlying infrastructure together to form the greater TON Ecosystem.

Directual TON plugin

Directual TON plugin allows you to create Web-apps, Telegram Mini Apps easily and securely using no-code approach.

Step 1. Install free TON plugin from the Marketplace in your Directual app

Step 2. Add a webhook for notifications

Step 3. Exploring the scenario plugin

Usually, such scenarios run on a scheduler manner (hourly, for example), the data structure (let's name it trigger) contains a single object.

Specify the wallet address to get the transactions and the field where to save the API response:

The response looks like:

{
    "transactions": [
        {
            "hash": "8c0276b72beecc5d7eba39d693fb9f8b266258caef1200f7970006b2f79d7c06",
            "lt": 46659096000001,
            "account": {
                "address": "0:84a12aee228a602c8e37a84c7e62d7846c26d6",
                "is_scam": false,
                "is_wallet": true
            },
            "success": true,
            "in_msg": {
                "msg_type": "int_msg",
                "value": 20000000,
                "fwd_fee": 266669,
                "destination": {
                    "address": "0:84a12aee228aa63a84c7e62d7846c26d6",
                    "is_scam": false,
                    "is_wallet": true
                },
                "source": {
                    "address": "0:18857605abfbbc6f1bfbb4f668bf3680",
                    "is_scam": false,
                    "is_wallet": true
                },
                "decoded_body": {
                    "text": "Order #123"
                }
            }
        }
    ]
}

Key things here are:

  • transactions.in_msg.value

  • transactions.in_msg.decoded_body.text

  1. Create a new data structure ton transactions with needed fields;

  2. Add a field type of arrayLink to transactions data structure to the structure trigger

  3. Configure JSON-step: add the json-scheme (copy it above) and set up matching

All right, we get all the transactions. Then we can identify them using comments/values, etc.

Hint: if you want to extract oder number from text like Your order is #12345, use the following expression (turn on JS-evaluation):

"{{text}}".match(/#(.+)/) ? "{{text}}".match(/#(.+)/)[1] : ""

Step 4. Exploring web-plugin

Add a Pay in TONs component to your web-page

Pay attention that amount is in nanoTons. 1 000 000 000 nanoTONs = 1 TON

The user will see the two-component:

  1. First step – connecting wallet (Telegram wallet, MyTonWallet, Tonkeeper, etc.)

  2. Second step – confirming transaction

Step 5. Processing transactions

When the user confirms the transaction, you'll get a notification via webhook (don't forget to turn on CORS for it!)

Notification body:

{
   "user": "36142243",
   "addressFrom": "0:18857605abf7216fa98ae1bbc6f1bfbb4f668bf3680",
   "addressTo": "UQCEoSruIoqmNBdQrEzTd6hMfmLXhGwm1hF4",
   "orderNumber": "123",
   "status": "success",
   "amountTons": "0.02",
   "amountNanoTons": 20000000
}

user will be null if your user is not authorised.

Don't use that notification for confirming your orders! Because one can send a fake request to your webhook. Use that notification as a trigger for checking the blockchain!

Go to API → and add a new one. Turn on CORS for it!

First — you have Get transactions step in your scenario. It calls /v2/blockchain/accounts/{account_id}/transactions method of .

Let's use for parsing the response! For that we need:

Configure the plugin (paste to the webhook URL of the ).

Bear in mind that there may be a certain lag between notification and transaction completing (usually 1-3 minutes). Thus, use in the scenario, that is triggered by the webhook.

🔌
Webhooks
TON API
JSON-step
Delay step
webhook we'e created
The Open Network