Use this method when you need to launch the TronDesigner Editor as a standalone page hosted on our infrastructure, without embedding the Web Integration Script. This is the ideal solution for backend-driven systems (ERP/CRM), mobile apps, or communication tools where executing JavaScript in the host environment is not possible.

When to use URL Integration

URL-based opening is designed for systems that cannot or should not host an embedded iframe or dialog.

• ERP/CRM Systems: Launching the editor directly from a "Create Order" screen in your back-office.

• Email Workflows: Sending a "Click to Personalize" link to a customer.

• Mobile Apps: Opening the editor in a system browser.

• Limited Environments: Platforms where you don't control the frontend JavaScript.

Core Principles

When you choose URL integration, the entire design session happens on a new browser tab at integration.trondesigner.com. Because the Editor is not "inside" your page, the “handshake” follows this logic:

• Hosting: The editor is hosted by us. You simply redirect the user to a specific URL.

• Data Return: Since you cannot "listen" for JavaScript events, you must use Webhooks or the REST API to find out when a user finishes a design.

• Best For: ERP/CRM: A "Design" button inside a back-office tool that has product IDs but no frontend flexibility.

• The Final Step: Regardless of how you construct the URL (Simple, Encoded, or Secure), the final action is always a browser redirection to launch the session.

Choosing Your URL Format (“transport method“)

You can construct the URL in three ways. The data payload (Editor Arguments JSON) is the same as in the Script-based method, but the "envelope" changes.

URL Attributes (Simple)

Pass basic key-value pairs directly in the query string. This is the equivalent of the "HTML Attributes" method.

• Security: Low (Data is visible in URL).

• Best for: Quick prototypes or internal tools where only a Product ID is needed.

• Implementation: Manually concatenate your parameters into a string (e.g., .../editor?modelCode=123&api_key=XXX) and redirect the user to this link.

Example
Simple URL
Copy
https://integration.trondesigner.com/editor?apiKey=bu2jospyyzktz8gqzybfgatnm&supplierCode=AODACi&modelCode=AAP003

URL Encoded JSON (Advanced)

You take the full Editor Arguments JSON, URL-encode it, and pass it as a single parameter.

• Security: Low (Data is public/base64-style encoding).

• Constraint: Browsers have URL length limits. If your JSON is very large (e.g., you are using own (custom) mode with custom product data), the URL might break.

• Example: .../editor?options=%7B%22product%22%3A%7B%22modelCode%22...%7D

• Best for: Scenarios that require complex configurations (beyond simple product codes) but cannot perform a backend API “handshake” (e.g., static links or no-code automation).

• Implementation: Use a URL-encoding function on your JSON object, append it to the base URL, and redirect the user to the resulting link.

Secure Token (Recommended)

Instead of putting data in the URL, your backend prepares the JSON and asks our API for a Session Token. You then redirect the user using only that token.

• Security & Integrity: High. The URL contains no product data or API keys — only a one-time token. This prevents users from manual changes in the browser.

• Production Ready: This is the recommended method for all live environments.

• The Workflow: This is the professional "Server-to-Server" workflow. To generate a secure session, your backend must call the REST API (not the Editor URL).

Example
Token
Copy
https://integration.trondesigner.com/editor?token=eyJwcm9kdWN0Q29kZSI6IjEwMDAwMjAwIn0=

Implementation: The 3-Step Secure “Handshake”

1. The Backend Call: Your server performs a POST request to our REST API using the same JSON structure found in the Editor Arguments section.

   • Endpoint: POST /generate-open-editor-link.

   • Authentication: Requires a REST API Key (found in Admin Portal > API Keys).

     • You can check the REST API page.

   • Payload: Includes your JSON configuration + optional redirectUrl.

2. The Response: Our API validates the data and returns a unique, temporary token and a pre-built URL.

   • Example:
     

     {
       "token": "a1b2c3d4e5f6g7h8",
       "url": "https://integration.trondesigner.com/editor?token=a1b2c3d4e5f6g7h8"
     }

3. Redirection: Your system places this URL behind a button or sends it via email. When the user clicks, the Editor opens with all pre-configured data loaded securely.

Output: How to get data back?

Since there is no "Host Page" with JavaScript events, you must use backend methods to capture the result of the user's design session:

Webhooks (Server-side)

Webhooks are HTTP POST callbacks sent from TronDesigner’s servers directly to your backend. In URL-based integrations, Webhooks are your primary data source. Since the editor is not embedded in your page, your server uses the Webhook to receive the printJobGuid and session details the moment the user completes their design session.

• Best for: Real-time order synchronization and backend automation.

• See details: Webhooks to learn how to set up your endpoint listener.

REST API (Server-side)

Once your backend receives a printJobGuid via a Webhook, use the REST API to "reach back" into TronDesigner. This allows your server to pull specific assets required for fulfillment or your internal ERP, such as high-resolution production files or PDF proofs.

• Best for: Securely fetching production-ready files and design metadata.

• See details: REST API for full endpoint documentation.

Summary Guide: How to Proceed

To complete your URL-based integration, follow this checklist:

1. Select URL Method: Choose between Simple Attributes (testing) or the Secure Token (production-ready).

   • Encoded JSON is the least recommended method due to its complexity and low security.

2. Input: Construct your Editor Arguments JSON (defining the Product, Modes, and any Printings).

3. Generate: Secure Method: Implement a backend script to POST your JSON to our REST API to receive a signed session URL.

   1. Simple/Encoded method: Concatenate your URL string.

4. Redirect: Place the resulting URL behind a button in your ERP/CRM or include it in an automated email.

5. Listen: Set up a Webhook listener on your server. This is the only way to automatically receive the printJobGuid when the user finishes.

6. Retrieve: Use the REST API with the printJobGuid to fetch the final production PDF and design metadata for your records.

Next Steps

Ready to implement URL calls? Check these resources:

• REST API (Swagger) – View the technical documentation.

• Webhooks – Learn how to listen for design completions on your server.

• Editor Arguments – Understand the JSON structure used in the init request.