---
title: Customizing requests from the OIDC module in JavaScript
description: PingOne Advanced Identity Cloud PingAM PingOne JavaScript
component: orchsdks
page_id: orchsdks:oidc:customization/requests/javascript-request-interceptors
canonical_url: https://developer.pingidentity.com/orchsdks/oidc/customization/requests/javascript-request-interceptors.html
revdate: Fri, 24 Apr 2026 12:04:51 +0000
section_ids:
  step_1_creating_request_middleware_instances: Step 1. Creating request middleware instances
  examples: Examples
  step_2_configuring_the_oidc_module_to_use_middleware: Step 2. Configuring the OIDC module to use middleware
---

# Customizing requests from the OIDC module in JavaScript

[icon: circle-check, set=far]PingOne Advanced Identity Cloud [icon: circle-check, set=far]PingAM [icon: circle-check, set=far]PingOne [icon: js, set=fab]JavaScript

The Orchestration SDK for JavaScript supports the **RequestMiddleware** type for adding custom logic to network requests.

You can use this request middleware to modify requests before they're sent.

For example, you can add or customize:

* Query parameters

* Headers

* Body data

## Step 1. Creating request middleware instances

To customize network requests, create one or more `RequestMiddleware` instance:

Creating a RequestMiddleware instance in JavaScript

```javascript
const loggingMiddleware = (req, action, next) => {
  switch (action.type) {
    case 'USER_INFO':
      console.log(`Obtaining user info: ${req.url}`);
      break;
  }
  next();
}
```

Request middleware has the following inputs:

* *Request object*

  Represents the original request, and has information about the body, method type, parameters, and more.

* *Action object*

  Represents the type of operation the request performs. You can check `action.type` to only apply customizations to certain requests.

  Available action types are as follows:

  | Value            | Description                                        |
  | ---------------- | -------------------------------------------------- |
  | `AUTHORIZE`      | Obtaining authorization token                      |
  | `TOKEN_EXCHANGE` | Exchanging authorization code for an access token  |
  | `REVOKE`         | Revoking a refresh or access token                 |
  | `USER_INFO`      | Obtaining information from the `userinfo` endpoint |
  | `END_SESSION`    | Ending an OAuth 2.0 session                        |

* *Next method*

  Proceeds to the next middleware, if configured.

### Examples

To customize requests, create middleware that alters requests with your own values.

* Headers

* Query parameters

* Body data

Customizing headers using request middleware

```javascript
const customHeaderMiddleware = (req, action, next) => {
  req.headers.set('X-User-Agent', 'MyApp/1.0');
  next();
}
```

Customizing query parameters using request middleware

```javascript
const customParamMiddleware = (req, action, next) => {
  req.url.searchParams.set('lang', 'en-UK');
  req.url.searchParams.set('brand', 'example.co.uk');
  next();
}
```

Customizing body data using request middleware

```javascript
const customJSONPost = (req, action, next) => {
  // Add JSON body data to a POST request
  req.body = (JSON.stringify({ name: 'Babs Jensen', "email": "babs@example.com" }));
  req.method = "POST";
  next();
}

const customJSONPut = (req, action, next) => {
  // Add JSON body data to a PUT request
  req.body = (JSON.stringify({ name: 'Updated Name', email: "updated@example.com" }));
  req.method = "PUT";
  next();
}

const customFormPost = (req, action, next) => {
  // Add form-encoded body data to a POST request
  const formData = new FormData();
  formData.append('name', 'Babs Jensen');
  formData.append('email', 'babs@example.com');

  req.body = formData;
  req.method = "POST";
  next();
}
```

## Step 2. Configuring the OIDC module to use middleware

Pass the names of your custom middleware to the **OIDC** module in the `requestMiddleware` parameter in the configuration:

Configuring the `OIDC` module

```javascript
const oidcClient = oidc({
  // Custom middleware
  requestMiddleware: [
    customHeaderMiddleware,
    customParamMiddleware,
    customFormPost
  ],
  // Other configuration
  config: {
    clientId: '6c7eb89a-66e9-ab12-cd34-eeaf795650b2',
    redirectUri: 'https://localhost:8443/callback.html',
    scope: 'openid profile email phone',
    serverConfig: {
      wellknown:
        'https://auth.pingone.ca/3072206d-c6ce-ch15-m0nd-f87e972c7cc3/as/.well-known/openid-configuration',
    },
  },
});
```
