javascript - How to typify axios request headers - Stack Overflow

admin管理员组

文章数量:1432178

I'm trying to send request via Axios and I want to typify request headers. But I get an error.

I've created an interface Headers and used it to declare variable this._apiHeaders.

Error text:

The "Headers" type cannot be assigned to the "AxiosRequestHeaders" type.
There is no index signature for the "string" type in the "Headers" type (ts2322)

interface Headers {
    'X-Parse-Application-Id': string,
    'X-Parse-REST-API-Key': string
}

const response: ITest = await axios.get(
  this.formCorrectApiUrl(Endpoints.classes, DBObjectName),
  {
    headers: this._apiHeaders    // Here I get error
  }
);

Can someone please tell me how to fix the error and why it occures.

I'm trying to send request via Axios and I want to typify request headers. But I get an error.

I've created an interface Headers and used it to declare variable this._apiHeaders.

Error text:

The "Headers" type cannot be assigned to the "AxiosRequestHeaders" type.
There is no index signature for the "string" type in the "Headers" type (ts2322)

interface Headers {
    'X-Parse-Application-Id': string,
    'X-Parse-REST-API-Key': string
}

const response: ITest = await axios.get(
  this.formCorrectApiUrl(Endpoints.classes, DBObjectName),
  {
    headers: this._apiHeaders    // Here I get error
  }
);

Can someone please tell me how to fix the error and why it occures.

• javascript
• typescript
• axios

Share Improve this question Follow asked Jun 20, 2022 at 16:25 WellsWells 13122 silver badges1111 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

This can be implemented through "extends"

interface Headers extends AxiosRequestHeaders {
  'X-Parse-Application-Id': string
  'X-Parse-REST-API-Key': string
}

But I remend making additionally the ability to create fields optional.

export type NonUndefined<T, E = undefined> = Pick<
  T,
  {
    [Prop in keyof T]: T[Prop] extends E ? never : Prop
  }[keyof T]
>

interface Headers extends AxiosRequestHeaders {
  'X-Parse-Application-Id': string
  'X-Parse-REST-API-Key': string
}

type AxiosHeaders = NonUndefined<Headers>

const headers: AxiosHeaders = {
  'X-Parse-Application-Id': 'test',
}

Please try this

import axios, { AxiosRequestHeaders } from 'axios';

await axios.get(url, { headers: (this._apiHeaders as any as AxiosRequestHeaders) })

本文标签： javascriptHow to typify axios request headersStack Overflow