Розширте експрес-запит за допомогою Typescript

Я намагаюся додати властивість для вираження об'єкта запиту від середнього програмного забезпечення за допомогою typecript. Однак я не можу зрозуміти, як додати до об’єкта додаткові властивості. Я вважаю за краще не використовувати позначення дужок, якщо можливо.

Я шукаю рішення, яке дозволило б мені написати щось подібне до цього (якщо можливо):

app.use((req, res, next) => {
    req.property = setProperty(); 
    next();
});

Ви хочете створити власне визначення та використовувати функцію в Typescript під назвою Об’єднання декларацій . Це зазвичай використовується, наприклад, вmethod-override .

Створіть файл custom.d.tsі переконайтеся , щоб включити його в tsconfig.json«s files-сече- , якщо такі є. Вміст може виглядати так:

declare namespace Express {
   export interface Request {
      tenant?: string
   }
}

Це дозволить вам у будь-якій точці коду використовувати щось подібне:

router.use((req, res, next) => {
    req.tenant = 'tenant-X'
    next()
})

router.get('/whichTenant', (req, res) => {
    res.status(200).send('This is your tenant: '+req.tenant)
})

Як запропоновано коментарями у програміindex.d.ts , ви просто оголосите у глобальному Expressпросторі імен будь-які нові учасники. Приклад:

declare global {
  namespace Express {
    interface Request {
      context: Context
    }
  }
}

Повний приклад:

import * as express from 'express';

export class Context {
  constructor(public someContextVariable) {
  }

  log(message: string) {
    console.log(this.someContextVariable, { message });
  }
}

declare global {
  namespace Express {
    interface Request {
      context: Context
    }
  }
}

const app = express();

app.use((req, res, next) => {
  req.context = new Context(req.url);
  next();
});

app.use((req, res, next) => {
  req.context.log('about to return')
  res.send('hello world world');
});

app.listen(3000, () => console.log('Example app listening on port 3000!'))

Розширення глобальних просторів імен детальніше висвітлено в моїй GitBook .

Для новіших версій express потрібно збільшити express-serve-static-coreмодуль.

Це потрібно, тому що тепер об’єкт Express надходить звідти: https://github.com/DefinitelyTyped/DefinrelyTyped/blob/8fb0e959c2c7529b5fa4793a44b41b797ae671b9/types/express/index.d.ts#L19

В основному, використовуйте наступне:

declare module 'express-serve-static-core' {
  interface Request {
    myField?: string
  }
  interface Response {
    myField?: string
  }
}

Прийнята відповідь (як і інші) не працює для мене, але

declare module 'express' {
    interface Request {
        myProperty: string;
    }
}

зробив. Сподіваюся, що хтось допоможе.

Спробувавши 8 відповідей і не маючи успіху. Нарешті мені вдалося змусити його працювати з коментарем jd291 , що вказує на 3mards repo .

Створіть файл у базі під назвою types/express/index.d.ts. І в ньому пишіть:

declare namespace Express {
    interface Request {
        yourProperty: <YourType>;
    }
}

і включіть його tsconfig.jsonдо:

{
    "compilerOptions": {
        "typeRoots": ["./types"]
    }
}

Тоді yourPropertyмає бути доступним під кожен запит:

import express from 'express';

const app = express();

app.get('*', (req, res) => {
    req.yourProperty = 
});

Жодне із запропонованих рішень не працювало для мене. Я закінчила просто розширення інтерфейсу Request:

import {Request} from 'express';

export interface RequestCustom extends Request
{
    property: string;
}

Тоді для його використання:

import {NextFunction, Response} from 'express';
import {RequestCustom} from 'RequestCustom';

someMiddleware(req: RequestCustom, res: Response, next: NextFunction): void
{
    req.property = '';
}

Редагувати : Останні версії TypeScript скаржаться на це. Натомість мені довелося зробити:

someMiddleware(expressRequest: Request, res: Response, next: NextFunction): void
{
    const req = expressRequest as RequestCustom;
    req.property = '';
}

У TypeScript інтерфейси відкриті. Це означає, що ви можете додавати до них властивості з будь-якого місця, просто переробивши їх.

Зважаючи на те, що ви використовуєте цей файл express.d.ts , ви повинні мати змогу перевизначити інтерфейс запиту, щоб додати додаткове поле.

interface Request {
  property: string;
}

Тоді у вашій функції проміжного програмного забезпечення параметр req також повинен мати це властивість. Ви повинні мати можливість користуватися ним без змін у вашому коді.

Хоча це дуже давнє запитання, я останнім часом натрапив на цю проблему. Прийнята відповідь працює нормально, але мені потрібно було додати користувальницький інтерфейс Request- інтерфейс, який я використовував у своєму коді, і який не так добре працював із прийнятим відповідь. Логічно я спробував це:

import ITenant from "../interfaces/ITenant";

declare namespace Express {
    export interface Request {
        tenant?: ITenant;
    }
}

Але це не спрацювало, тому що Typescript розглядає .d.tsфайли як глобальний імпорт, а коли в них є імпорт, вони розглядаються як звичайні модулі. Ось чому наведений вище код не працює на стандартних налаштуваннях машинопису.

Ось що я закінчив робити

// typings/common.d.ts

declare namespace Express {
    export interface Request {
        tenant?: import("../interfaces/ITenant").default;
    }
}

// interfaces/ITenant.ts

export interface ITenant {
    ...
}

Можливо, на це питання було відповідено, але я хочу поділитися трохи, але іноді інтерфейс, як і інші відповіді, може бути трохи обмежуючим, але ми можемо насправді підтримувати необхідні властивості, а потім додавати будь-які додаткові властивості, які потрібно додати, створивши ключ з типом stringзі значенням типуany

import { Request, Response, NextFunction } from 'express'

interface IRequest extends Request {
  [key: string]: any
}

app.use( (req: IRequest, res: Response, next: NextFunction) => {
  req.property = setProperty();

  next();
});

Тож тепер ми також можемо додати до цього об’єкта будь-яку додаткову властивість.

Якщо ви шукаєте рішення, яке працює з express4, ось це:

@ vrste / express / index.d.ts: -------- має бути /index.d.ts

declare namespace Express { // must be namespace, and not declare module "Express" { 
  export interface Request {
    user: any;
  }
}

tsconfig.json:

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es2016",
    "typeRoots" : [
      "@types", // custom merged types must be first in a list
      "node_modules/@types",
    ]
  }
}

Посилання з https://github.com/TypeStrong/ts-node/isissue/715#issuecomment-526757308

Усі ці відповіді, схоже, так чи інакше є неправильними або застарілими.

Це працювало для мене в травні 2020 року:

в ${PROJECT_ROOT}/@types/express/index.d.ts:

import * as express from "express"

declare global {
    namespace Express {
        interface Request {
            my_custom_property: TheCustomType
        }
    }
}

в tsconfig.json, додайте / об'єднайте властивість таким чином:

"typeRoots": [ "@types" ]

Ура.

Одне можливе рішення - використовувати "подвійний кастинг на будь-який"

1- визначте інтерфейс зі своїм майном

export interface MyRequest extends http.IncomingMessage {
     myProperty: string
}

2- подвійний акторський склад

app.use((req: http.IncomingMessage, res: http.ServerResponse, next: (err?: Error) => void) => {
    const myReq: MyRequest = req as any as MyRequest
    myReq.myProperty = setProperty()
    next()
})

Переваги подвійного лиття полягають у тому, що:

• типізація доступна
• він не забруднює існуючі визначення, але розширює їх, уникаючи плутанини
• так як виливок явно, він збирає штрафи з -noImplicitanyпрапором

Крім того, існує швидкий (нетипізований) маршрут:

 req['myProperty'] = setProperty()

(не редагуйте існуючі файли визначення з власними властивостями - це неможливо досягти. Якщо визначення неправильні, відкрийте запит на витягнення)

EDIT

Дивіться коментар нижче, простий кастинг працює в цьому випадку req as MyRequest

Ця відповідь буде корисна тим, хто покладається на пакет npm ts-node.

Я також боровся з такою ж занепокоєністю щодо розширення об'єкта запиту , я дотримувався безлічі відповідей у ​​переповненні стека та закінчувався, дотримуючись наведеної нижче стратегії.

Я оголосив розширене введення тексту для експресу в наступному каталозі.${PROJECT_ROOT}/api/@types/express/index.d.ts

declare namespace Express {
  interface Request {
    decoded?: any;
  }
}

потім оновлення мого tsconfig.jsonдо чогось подібного.

{
  "compilerOptions": {
     "typeRoots": ["api/@types", "node_modules/@types"]
      ...
  }
}

навіть зробивши вищезазначені кроки, візуальна студія перестала скаржитися, але, на жаль, ts-nodeкомпілятор все-таки звик кидати.

 Property 'decoded' does not exist on type 'Request'.

Мабуть, ts-nodeне вдалося знайти визначення розширеного типу для запиту об'єкта .

Врешті-решт, витративши години, як я знав, Кодекс VS не скаржився і зміг знайти визначення тексту, маючи на увазі, що щось не так із ts-nodeкомплаєром.

Початок оновлення scriptу package.jsonфіксованому для мене.

"start": "ts-node --files api/index.ts",

тут --filesаргументи відіграють ключову роль, знаходячи визначення визначень користувацького типу.

Для отримання додаткової інформації відвідайте: https://github.com/TypeStrong/ts-node#help-my-types-are-missing

Щоб допомогти будь-кому, хто просто шукає щось інше, спробувати тут - те, що працювало для мене в кінці травня 2020 року, коли намагалися продовжити запит ExpressJS. Мені довелося спробувати більше десятка речей, перш ніж це почати працювати:

• Перевірте порядок того, що всі рекомендують, у "typeRoots" вашого tsconfig.json (і не забудьте скинути шлях до src, якщо у вас є налаштування rootDir у tsconfig, наприклад "./src"). Приклад:

"typeRoots": [
      "./node_modules/@types",
      "./your-custom-types-dir"
]

• Приклад спеціального розширення ('./your-custom-types-dir/express/index.d.ts "). Мені довелося використовувати вбудований імпорт та експорт за замовчуванням, щоб використовувати класи як тип мого досвіду, щоб це було також показано:

declare global {
  namespace Express {
    interface Request {
      customBasicProperty: string,
      customClassProperty: import("../path/to/CustomClass").default;
    }
  }
}

• Оновіть файл nodemon.json, щоб додати команду "--files" до вузла ts, наприклад:

{
  "restartable": "rs",
  "ignore": [".git", "node_modules/**/node_modules"],
  "verbose": true,
  "exec": "ts-node --files",
  "watch": ["src/"],
  "env": {
    "NODE_ENV": "development"
  },
  "ext": "js,json,ts"
}

На цю відповідь може бути вже пізно, але все одно ось як я вирішив:

1. Переконайтеся, що у вашому tsconfigфайлі включено джерело типів (це може бути абсолютно новий потік)
2. Всередині каталогу типів додайте новий каталог і назвіть його як пакет, для якого потрібно розширити або створити типи. У цьому конкретному випадку ви створите каталог із назвоюexpress
3. Всередині expressкаталогу створіть файл і index.d.tsдайте ім’я йому (ПОВИННО БУДЕ ТОЧНО ТАКЕ)
4. Нарешті, щоб зробити розширення типів, вам просто потрібно поставити код на зразок наступного:

declare module 'express' {
    export interface Request {
        property?: string;
    }
}

чому нам потрібно робити стільки клопотів, як у вищезазначених відповідях, коли ми можемо піти, роблячи саме це

замість того, щоб прив’язувати наше майно до запиту , ми можемо приєднати його до заголовків запитів

   req.headers[property] = "hello"