Edge Developer Platform
  • Edge Functions
    • Overview
    • Getting Started
    • Operation Guide
      • Function Management
      • Function Trigger
    • Runtime APIs
      • addEventListener
      • Cache
      • Cookies
      • Encoding
      • Fetch
      • FetchEvent
      • Headers
      • Request
      • Response
      • Streams
        • ReadableStream
        • ReadableStreamBYOBReader
        • ReadableStreamDefaultReader
        • TransformStream
        • WritableStream
        • WritableStreamDefaultWriter
      • Web Crypto
      • Web standards
      • Images
        • ImageProperties
    • Sample Functions
      • Returning an HTML Page
      • Returning a JSON Object
      • Fetch Remote Resources
      • Authenticating a Request Header
      • Modifying a Response Header
      • Performing an A/B Test
      • Setting Cookies
      • Performing Redirect Based on the Request Location
      • Using the Cache API
      • Caching POST Requests
      • Responding in Streaming Mode
      • Merging Resources and Responding in Streaming Mode
      • Protecting Data from Tampering
      • Rewriting a m3u8 File and Configuring Authentication
      • Adaptive Image Resize
      • Image Adaptive WebP
      • Customize Referer restriction rules
      • Remote Authentication
      • HMAC Digital Signature
      • Naming a Downloaded File
      • Obtaining Client IP Address
    • Best Practices
      • Adaptive Image Format Conversion via Edge Functions
Docs Overview/
Edge Developer Platform/
Edge Functions/
Runtime APIs/
addEventListener/

addEventListener

This API is used to register an event listener for a target. The event listener triggers an edge function when the specified type of event is delivered to the target. Only one event listener takes effect for the same type of event. Only fetch request events are supported currently. If a fetch event occurs after a fetch event listener is registered, the event listener generates a FetchEvent object to process the HTTP request.

Overview

function addEventListener(type: string, listener: (event: FetchEvent) => void): void;

Parameters

Parameter
Type
Required
Description
type
string
Yes
Event type.
Only fetch request events are supported.
If you specify a request event type other than fetch, the Edge Functions engine throws an Error exception.
listener
(event: FetchEvent) => void
Yes
Event listener that is used to process event callbacks.
You can register a fetch event listener to generate FetchEvent objects.

Sample Code

// Register a fetch event listener.
addEventListener('fetch', (event) => {
  // Respond to the client.
  event.respondWith(new Response('Hello World!'));
});

References

MDN documentation: addEventListener
Sample Functions: Returning an HTML Page
Sample Functions: Returning a JSON Object