Skip to main content
Version: 4.6.1-saas

Web/JavaScript Agent

Overview

JavaScript Agent is a client-side SDK that provides NetFUNNEL 4 traffic control functionality for web applications.

Key Features

  • Client-side SDK: Direct integration into web pages with simple JavaScript API calls
  • Two Integration Methods: Choose between URL-Triggered Integration (no code) and Code-based Integration (precise control)
  • Flexible Control: URL-Triggered for page-level protection, Code-based for button/API-level control
  • Native Waiting Rooms: WebView-based waiting room templates with customizable UI options
  • Real-time Queue Updates: Receive live queue position, wait time, and progress information
  • Network Recovery: Automatic recovery from network issues to maintain user experience
  • Robust Error Handling: Comprehensive callback system with smart error handling strategies
  • Lightweight SDK: Minimal dependencies with vanilla JavaScript support
  • Cross-browser Compatibility: Works with all modern browsers and frameworks

System Requirements

  • Browsers: Chrome 60+, Firefox 55+, Safari 12+, Edge 79+
  • JavaScript: ES6+ support required
  • Frameworks: Compatible with React, Vue, Angular, vanilla JavaScript, and more
  • HTTPS: Required for production environments

Compatible Environments

  • Web Applications: Single Page Applications (SPA), Multi Page Applications (MPA), Progressive Web Apps (PWA)
  • Frameworks: React, Vue.js, Angular, Next.js, Nuxt.js, and vanilla JavaScript
  • All Web Platforms: Desktop browsers, mobile browsers, embedded webviews

How It Works

  1. SDK Initialization: Include NetFUNNEL script and initialize with your configuration
  2. Integration Choice: Use URL-Triggered Integration (automatic) or Code-based Integration (manual control)
  3. WebView Waiting Room: SDK displays WebView-based waiting room (default template or custom UI)
  4. User Experience: Seamless integration with your website's design and flow

Integration Method Examples

URL-Triggered Integration Flow:

User visits URL → Automatic check → Waiting Room (if needed) → Original page

Code-based Integration Flow:

User Action → nfStart() → Waiting Room → onSuccess() → User Proceeds → nfStop()

Integration Methods

1. URL-Triggered Integration

  • Best for: Page-level protection, landing pages, promotions
  • Setup: Configure trigger rules in console (no code changes)
  • User Experience: Automatic redirect to waiting room, then return to target page
  • Control Level: Page-based traffic control

2. Code-based Integration

  • Best for: Button clicks, API calls, precise control
  • Setup: Call NetFUNNEL functions in your JavaScript code
  • User Experience: Modal waiting room on current screen
  • Control Level: Action-based traffic control

Limitations

Mobile App Considerations
  • This SDK does not work in native mobile app environments (Android/iOS native code)
  • For native mobile app traffic control, use Android Agent or iOS Agent

Getting Started

To quickly begin with JavaScript Agent, refer to the Quickstart guide.

Practice Projects Available

Need a basic project to practice with? Check out our Sample Projects which include a Web Application (Vanilla JavaScript MPA) template ready for NetFUNNEL JavaScript Agent integration practice.

Documentation

Core Documentation

Implementation Guides