# FetchEvent

`FetchEvent` is the event that Azion Runtime passes to a listener registered with [addEventListener](/en/documentation/devtools/runtime/api-reference/add-eventlistener/) for the `fetch` type. The listener defines what code runs when a request arrives, and the event carries the request data to it. The listener reads `event.request` to route, filter, or transform traffic. It then calls `event.respondWith()` with a response it builds, or with the response of a [fetch()](/en/documentation/devtools/runtime/api-reference/fetch/) call to an origin. For more information, refer to [FetchEvent](https://developer.mozilla.org/en-US/docs/Web/API/FetchEvent) on MDN Web Docs.

A handler written as `export default main(event)` receives the same `FetchEvent`, and `azion build` marks that shape as deprecated. For the recommended handler shape, refer to [Handlers](/en/documentation/devtools/runtime/api-reference/handlers/).

> **Note**
>
> Under `azion dev`, the event has no `args` property, and `event.request.metadata` is `undefined`.

---

## Constructor

Azion Runtime creates one `FetchEvent` for each request and passes it to the listener:

```javascript
addEventListener(type, listener)
```

Your code does not construct the event. In a deployed function, `new FetchEvent('fetch')` throws `TypeError: Illegal constructor.`

---

## Properties

| Property        | Type                                                                   | Description                                                                                                                                                                                |
| --------------- | ---------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `event.args`    | Object                                                                 | Args of the function instance, one property per key. An instance without Args passes `{}`. For more information, refer to [Args](/en/documentation/platform/functions/how-it-works/#args). |
| `event.console` | Object                                                                 | Console of the event, with methods such as `log()`.                                                                                                                                        |
| `event.request` | [`Request`](/en/documentation/devtools/runtime/api-reference/request/) | HTTP request that the function received. In a deployed function, `event.request.metadata` holds the request [metadata](/en/documentation/devtools/runtime/api-reference/metadata/).        |
| `event.type`    | String                                                                 | Type of the event: `fetch`.                                                                                                                                                                |

---

## Methods

| Method                        | Description                                                                                                                                                                                    |
| ----------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `event.respondWith(response)` | Sets the response the function sends to the client. `response` is a [`Response`](/en/documentation/devtools/runtime/api-reference/response/) or a promise that resolves to one.                |
| `event.waitUntil()`           | Present on the event. The `fetch(request, env, ctx)` handler exposes `ctx.waitUntil()`; for more information, refer to [Handlers](/en/documentation/devtools/runtime/api-reference/handlers/). |

---

## Example

This listener passes the event to a `handleRequest` function, and `event.respondWith()` sends the response that the function returns:

```javascript
async function handleRequest(event) {
  return new Response("Hello world");
}

addEventListener("fetch", (event) => {
  event.respondWith(handleRequest(event));
});
```

---

## Related resources

- [addEventListener](/en/documentation/devtools/runtime/api-reference/add-eventlistener.md): How to register the listener that receives a `FetchEvent`.
- [Request](/en/documentation/devtools/runtime/api-reference/request.md): The properties and methods of the request that `event.request` holds.
- [Handlers](/en/documentation/devtools/runtime/api-reference/handlers.md): The recommended `fetch(request, env, ctx)` handler shape and its arguments.
- [Web APIs](/en/documentation/devtools/runtime/api-reference/javascript.md): The other Web APIs that Azion Runtime supports.
