---
name: "UploadTask.onHeadersReceived"
mode: "kit"
versionRequirements:
  - { name: "BaseKit", version: "2.0.1" }
platform:
  - "iOS"
  - "Android"
---

## UploadTask.onHeadersReceived

> [VERSION] BaseKit >= 2.0.1

> [PLATFORM] iOS, Android

### Description

Listen for the HTTP Response Header event. Fires earlier than the request completion event

### Parameters

`(listener: Function)`

| Parameter | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `listener` | `(params: Object) => void` | Yes | - | Event listener callback function |

##### UploadTask.onHeadersReceived.listener(params) properties

| Property | Type | Required | Default | Since | Description |
| --- | --- | --- | --- | --- | --- |
| `header` | `Record<string, string>` | Yes | - | `2.0.1` | HTTP Response Headers returned by the developer server |
| `requestId` | `string` | Yes | - | `2.0.1` | Network request ID |


### Examples

#### Demo

```tsx
import { downloadFile, uploadFile } from '@ray-js/ray'

// Listen to response headers: after obtaining the UploadTask, register onHeadersReceived to get a callback when the server's response headers arrive (earlier than completion)
downloadFile({
  url: "https://airtake-public-data-1254153901.cos.ap-shanghai.myqcloud.com/ttttestfile/test_image.jpg",
  success: ({ tempFilePath }) => {
    const task = uploadFile({
      url: "https://httpbin.org/post",
      filePath: tempFilePath,
      name: "file",
      success: () => console.log("Upload complete"),
      fail: error => console.error(error),
    });
    task.onHeadersReceived(e => {
      console.log("Response headers received:", JSON.stringify(e.header));
    });
  },
  fail: error => console.error(error),
});
```
