---
title: "pageView"
slug: "cloud-sdk-events-browser-pageview"
abstract: "The pageView function sends a VIEW event from the browser side."
---
# pageView

|     |     |
| --- | --- |
| Type | Function |
| Import path | `@sitecore-cloudsdk/events/browser` |

Sends a [`VIEW`](https://doc.sitecore.com/sdk/en/developers/005/cloud-sdk/cloud-sdk-concepts/concepts-tracking/events/view-events.html "VIEW events") event.

## Signature

```typescript
export async function pageView(
  pageViewData?: PageViewData
): Promise<EPResponse | null>
```

## Parameters

| Name | Type | Description |
| --- | --- | --- |
| `pageViewData` | [`PageViewData`](https://doc.sitecore.com/sdk/en/developers/005/cloud-sdk/cloud-sdk-reference/cloud-sdk-events/cloud-sdk-events-browser/interfaces/cloud-sdk-events-pageviewdata.html "PageViewData") | Optional.<br><br>Data for [`VIEW`](https://doc.sitecore.com/sdk/en/developers/005/cloud-sdk/cloud-sdk-concepts/concepts-tracking/events/view-events.html "VIEW events") events. |

## Return value

Returns a promise.

## Examples

:::tab{title="Next.js"}

Example 31. Running the pageView function

:::tab{title="Next.js"}
> [!note]
> To run this function, you have to first [initialize](https://doc.sitecore.com/sdk/en/developers/005/cloud-sdk/cloud-sdk-reference/cloud-sdk-events/cloud-sdk-events-browser/functions/cloud-sdk-core-browser-cloudsdk.html "CloudSDK") the Cloud SDK.
>
> See [more examples](https://doc.sitecore.com/sdk/en/developers/005/cloud-sdk/cloud-sdk-reference/cloud-sdk-events/cloud-sdk-events-browser/functions/view-events.html "VIEW events") and [other data](https://doc.sitecore.com/sdk/en/developers/005/cloud-sdk/cloud-sdk-reference/cloud-sdk-events/cloud-sdk-events-browser/functions/cloud-sdk-events-pageviewdata.html "PageViewData") you can include in the event.

Here's an example of how to use the `pageView` function:

```typescript
"use client"; // Used only in Next.js App Router
import { useEffect } from "react";
import { pageView } from "@sitecore-cloudsdk/events/browser";

export default function Page(){
  useEffect(() => {
    pageView();
    console.log("Sent VIEW event.");
  }, [])

  return (<></>);
};
```

:::

:::

:::tab{title="JSS Next.js"}

Example 32. Customizing VIEW event capturing

:::tab{title="JSS Next.js"}
JSS Next.js apps automatically send `VIEW` events from every webpage using the `src/components/CdpPageView.tsx` component, with no coding required. If this default implementation doesn't suit your application requirements, you can [disable it](https://doc.sitecore.com/sai/en/developers/jss/22/jss-sai/configure-personalization-in-a-next-js-jss-app.html#UUID-030fa80e-067f-9052-8bb8-6d6e46daba49_section-idm1403329768567788), and then set up your own, customized `VIEW` event capturing.

Here's an example of how to set up your custom `VIEW` event capturing:

```typescript
import { pageView } from '@sitecore-cloudsdk/events/browser';
import {
  CdpHelper,
  useSitecoreContext,
} from '@sitecore-jss/sitecore-jss-nextjs';
import config from 'temp/config';

//...

const SitecorePage = ({
  notFound,
  componentProps,
  layoutData,
  headLinks,
}: SitecorePageProps): JSX.Element => {
  const {
    sitecoreContext: { route, variantId, site },
  } = useSitecoreContext();

  useEffect(() => {
    const language = route.itemLanguage || config.defaultLanguage;
    const scope = customScope || process.env.NEXT_PUBLIC_PERSONALIZE_SCOPE;

    const pageVariantId = CdpHelper.getPageVariantId(
        route.itemId,
        language,
        variantId as string,
        scope
    );

    // Ensure the module is initialized with CloudSDK().initialize() beforehand...

    // Run pageView:
    pageView({
      channel: //channel,
      currency: //currency,
      page: route.name,
      pageVariantId,
      language,
    }).catch((e) => console.debug(e));;
  }, [route, variantId, site]);
  //...
}
```

:::

:::