> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/unjs/ofetch/llms.txt
> Use this file to discover all available pages before exploring further.

# ofetch.native()

> Direct access to the native fetch API for standard fetch operations

## Overview

`ofetch.native()` provides a shortcut to the native `fetch` API, allowing you to use standard fetch when you don't need ofetch's additional features.

## Basic Usage

```typescript theme={null}
const response = await ofetch.native('/api/users')
const data = await response.json()
```

## When to Use

Use `ofetch.native()` when you:

* Need standard fetch behavior without ofetch enhancements
* Want to process the response manually
* Need compatibility with code expecting native fetch
* Want to avoid automatic JSON parsing or error handling

## How It Works

From `src/fetch.ts:266`:

```typescript theme={null}
$fetch.native = (...args) => fetch(...args);
```

This is a direct passthrough to the underlying fetch implementation configured for the ofetch instance.

## Comparison

### ofetch (default)

```typescript theme={null}
// Automatic JSON parsing
const users = await ofetch('/api/users')
// users is already parsed JSON

// Automatic error throwing
try {
  await ofetch('/api/404')
} catch (error) {
  console.error(error.status) // 404
}
```

### ofetch.native()

```typescript theme={null}
// Manual response handling
const response = await ofetch.native('/api/users')
const users = await response.json()

// Manual error checking
const response = await ofetch.native('/api/404')
if (!response.ok) {
  console.error(response.status) // 404
}
```

### ofetch.raw()

```typescript theme={null}
// Automatic parsing + access to response
const response = await ofetch.raw('/api/users')
const users = response._data // Already parsed
const headers = response.headers
```

## Common Use Cases

### Manual Response Processing

```typescript theme={null}
const response = await ofetch.native('/api/data')

// Check status before parsing
if (response.status === 304) {
  // Use cached data
  return getCachedData()
}

if (response.ok) {
  const data = await response.json()
  return data
}
```

### Streaming Response

```typescript theme={null}
const response = await ofetch.native('/api/large-file')
const reader = response.body?.getReader()

if (reader) {
  while (true) {
    const { done, value } = await reader.read()
    if (done) break
    // Process chunk
    processChunk(value)
  }
}
```

### Custom Content Type Handling

```typescript theme={null}
const response = await ofetch.native('/api/image')
const blob = await response.blob()
const imageUrl = URL.createObjectURL(blob)

// Display image
document.querySelector('img').src = imageUrl
```

### Progressive Enhancement

```typescript theme={null}
async function fetchData(url: string) {
  const response = await ofetch.native(url)
  
  // Custom error handling
  if (!response.ok) {
    if (response.status === 401) {
      redirectToLogin()
      return
    }
    throw new Error(`HTTP ${response.status}`)
  }
  
  // Check content type
  const contentType = response.headers.get('Content-Type')
  
  if (contentType?.includes('application/json')) {
    return await response.json()
  } else if (contentType?.includes('text/')) {
    return await response.text()
  } else {
    return await response.blob()
  }
}
```

## With Custom Instances

```typescript theme={null}
const apiFetch = ofetch.create({
  baseURL: '/api',
  headers: { 'X-Custom': 'header' }
})

// native() still uses baseURL and default headers
const response = await apiFetch.native('/users')
// Fetches from /api/users with X-Custom header
```

<Warning>
  `ofetch.native()` bypasses ofetch's automatic JSON parsing, error handling, and retry logic. You'll need to handle these manually.
</Warning>

## Implementation Details

From `src/index.ts:9-11`:

```typescript theme={null}
export const fetch: typeof globalThis.fetch = globalThis.fetch
  ? (...args: Parameters<typeof globalThis.fetch>) => globalThis.fetch(...args)
  : () => Promise.reject(new Error("[ofetch] global.fetch is not supported!"));
```

The fetch wrapper:

1. Uses `globalThis.fetch` if available (browser, modern Node.js)
2. Forwards all arguments to the native fetch
3. Throws an error if fetch is not supported

## Standard Fetch API

`ofetch.native()` supports all standard fetch options:

```typescript theme={null}
await ofetch.native('/api/users', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ name: 'John' }),
  credentials: 'include',
  cache: 'no-cache',
  redirect: 'follow',
  referrerPolicy: 'no-referrer'
})
```

## TypeScript

From `src/types.ts:14`:

```typescript theme={null}
export interface $Fetch {
  // ...
  native: Fetch;
  // ...
}
```

`native` is typed as the standard `Fetch` type:

```typescript theme={null}
const response: Response = await ofetch.native('/api/users')
```