Express.js×TypeScriptアプリのデータ送信をPostmanで確認する方法【PostgreSQL】

今回は、Express.jsとtypescriptで作成したアプリに対して、データ送信の結果をPostmanで確認する方法を記載していきます。

Postmanをインストール

下記のURLからアクセスしてインストールします。

Express.jsを起動する

アプリを起動します。
npm経由で起動させるためpackage.jsonに起動コマンドを追加します。

全体のpackage.jsonの中身は下記のとおりです。

package.json

{
  "dependencies": {
    "@types/pg": "^8.20.0",
    "bcrypt": "^6.0.0",
    "cors": "^2.8.6",
    "dotenv": "^17.4.2",
    "express": "^5.2.1",
    "express-session": "^1.19.0",
    "pg": "^8.22.0"
  },
  "devDependencies": {
    "@types/bcrypt": "^6.0.0",
    "@types/cors": "^2.8.19",
    "@types/express": "^5.0.6",
    "@types/express-session": "^1.19.0",
    "@types/node": "^26.0.0",
    "ts-node-dev": "^2.0.0",
    "typescript": "^6.0.3"
  },
    "scripts": {
    "dev": "ts-node-dev --respawn --files src/app.ts",
    "build": "tsc",
    "start": "node dist/app.js"
  }
}

src/presentation/controllers/AuthController.ts

import { Request, Response } from 'express';
import { AuthService }  from '../../application/services/AuthService';

type Test = import("express-session").SessionData;

const test: Test = {
  cookie: {} as any,
  userId: 1
};

export class AuthController {
    constructor(
        private AuthService:AuthService
    ){}

    register = async (
        req: Request,
        res: Response
    )=>{
        const {email,password} = req.body;
        const user = await this.AuthService.register(
            email,password
        );
        res.json(user);
    }

    login = async (
        req: Request,
        res: Response
    ) =>{
        const {email,password}=req.body;
        const user = await this.AuthService.login(email,password);
        
        if(!user){
            return res.status(401).json({
                message: "login failed"
            });
        }
        

        req.session.userId = user.id;// req.session.userId = user.id;
        res.json({
            message: "login success"
        });
    }

    logout = (
        req: Request,
        res: Response
    ) =>{
        req.session.destroy(()=>{
            res.json({message:"logout"})
        });
    }
}

src/app.ts

import express from "express";
import session from "express-session";
import dotenv from "dotenv";
import cors from "cors";
import authRouter from './presentation/routes/authRoutes';
import todoRouter from "./presentation/routes/todoRoutes";
import { authMiddleware } from "./middleware/authMiddleware";

dotenv.config();

const app = express();

app.use(express.json());

app.use(cors({
  origin:"http://localhost:3001",
  credentials:true
}));

app.use(
  session({
    secret:
      process.env.SESSION_SECRET!,
    resave:false,
    saveUninitialized:false,
    cookie:{
      secure:false,
      httpOnly:true
    }
  })
);

app.use("/auth", authRouter);

app.use(
  "/todos",
  authMiddleware,
  todoRouter 
);

app.listen(
  process.env.PORT,
  () => {
    console.log("server start");
  }
);

Postmanの起動とPost送信するまでの設定方法

今回は、POST送信するのでHTTPメソッドをPOSTに変更します。
つぎにURLですがこちらを「http://localhost:3000/auth/register」と入力します。
つぎにHeadersタブを開いて下記のように入力します。

こんなかんじですね👇

つづいて、送信内容のデータを入力します。
Bodyタブを選択⇒raw⇒jsonを選択します。

以上を入力してsendを押すとデータが登録されます。

トラブルシューティング

型拡張(.d.ts)したTSファイルがアプリに読み込まれないエラー

(事象)
npm run devすると下記が出た。

dev > ts-node-dev --respawn src/app.ts [INFO] 13:58:36 ts-node-dev ver. 2.0.0 (using ts-node ver. 10.9.2, typescript ver. 6.0.3) Compilation error in C:\Users\xxxx\Desktop\DartSample\backend\src\presentation\controllers\AuthController.ts [ERROR] 13:58:37 ⨯ Unable to compile TypeScript: src/presentation/controllers/AuthController.ts(8,3): error TS2353: Object literal may only specify known properties, and 'userId' does not exist in type 'SessionData'. src/presentation/controllers/AuthController.ts(41,21): error TS2339: Property 'userId' does not exist on type 'Session & Partial'.

(原因)
今回の原因は 「VSCodeのTypeScript Language Serverでは型拡張が見えているが、ts-node-dev が起動時にその .d.ts を読み込めていない」 です。

npx tsc --listFiles では出るのにnpm run devで失敗する場合、ts-node-dev の型読み込み問題でよく起きます。

対応方法

1. ts-node-dev に型ファイルを読み込ませる

package.json の dev を変更してください。

現在:

package.json

//(略)
"dev": "ts-node-dev --respawn src/app.ts"

変更:

package.json

//(略)
"dev": "ts-node-dev --respawn --files src/app.ts"

--files が重要です。

2. tsconfig.json の types を修正

以前あったこれ：

package.json

//(略)
"types": []

は削除してください。

または明示的に：

package.json

"types": [
  "node",
  "express-session"
]

にします。

なぜ今回こうなったか

tsc は

npx tsc --listFiles

で全ファイルを見るため、

src/types/express-session.d.ts

を拾えました。

しかし ts-node-dev は実行時に必要なファイルだけ読み込むため、デフォルトでは.d.tsのグローバル拡張を拾わない場合があります。

そのため、

package.json

ts-node-dev --files

を付ける必要があります。