javascript - 如何使用 TypeScript 和 Webpack 访问 Express 服务器中的 POST 请求正文？

问题描述

我使用基于 Webpack 的入门节点和 Express Web 服务器，使用 babel-loader 和 ts-loader。

接下来是部分代码：

webpack-config.js：

const path = require("path");
const nodeExternals = require("webpack-node-externals");
const Dotenv = require("dotenv-webpack");
require("dotenv/config");

const OUTPUT_FOLDER = process.env.OUTPUT_FOLDER;

module.exports = {
  mode: "development",
  watch: true,
  node: {
    __dirname: false,
  },
  externalsPresets: { node: true },
  entry: "./index.ts",
  resolve: {
    extensions: ['.tsx', '.ts', '.js'],
  },
  output: {
    filename: "main.js",
    path: path.resolve(__dirname, OUTPUT_FOLDER),
  },
  externals: [nodeExternals()],
  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env"],
          },
        },
      },
      {
        test: /\.tsx?$/,
        exclude: /node_modules/,
        use: 'ts-loader',
      },
    ],
  },
  plugins: [new Dotenv()],
};

tsconfig.json：

{
  "compilerOptions": {
    "outDir": "output",
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es6",
    "allowJs": true,
    "moduleResolution": "node"
  },
  "include": ["src/**/*.ts", "test/**/*.ts"],
  "exclude": ["node_modules"]
}

index.ts：

import * as express from 'express';    
const app = express();    
app.use(express.json());
app.use(express.urlencoded({ extended: true }));

app.post("/", (req, res) => {
  console.log(req.body);
  res.json("OK");
});

app.listen(5000, () => console.log("Server started at 5000..."));

当对路由执行 POST 请求时http://localhost:5000，它会激活index.ts文件中的路由，其中放置了命令console.log(req.body);在结果中，我在终端中看到了空对象 - {}。

该请求是由Postman程序发出的，如屏幕截图所示：

它与这样的请求相同：

axios.post("http://localhost:5000/", {
  _id: "12345",
  name: "Sim-sim open",
});

感谢关注！

标签： javascripttypescriptexpresswebpackbabeljs

javascript - 如何使用 TypeScript 和 Webpack 访问 Express 服务器中的 POST 请求正文？

问题描述

解决方案

推荐阅读