H3初识——入门介绍之事件处理器

简介

事件处理器是一个接收 H3Event 并返回响应的函数。

快速使用

import { H3, defineHandler, serve } from "h3";

const app = new H3();

const handler = defineHandler((event) => {
  return "Hello H3!";
});

app.get("/", handler);

serve(app, { port: 3000 });

获取请求参数

import { H3, defineHandler, serve, getQuery } from "h3";

const app = new H3();

const handler = defineHandler((event) => {
  const query = getQuery(event);
  console.log("query", query);
  return "Hello H3!";
});

app.get("/getUser", handler);

serve(app, { port: 3000 });

获取请求体

import { H3, defineHandler, serve, readBody } from "h3";

const app = new H3();

const handler = defineHandler(async (event) => {
  const body = await readBody(event);
  console.log("body", body);
  return "Hello H3!";
});

app.post("/addUser", handler);

serve(app, { port: 3000 });

对象语法

通过 middleware 属性注册中间件函数，通过 meta 属性传递元数据，方便在中间件中访问。

import { defineHandler } from "h3";

const handler = defineHandler({
  middleware: [
    // 这里可以放中间件函数
  ],
  meta: { tag: "admin" },
  handler: (event) => "Hi!",
});

处理器 .fetch

const handler = defineHandler(async (event) => `Request: ${event.req.url}`);

const response = await handler.fetch("http://localhost/");
console.log(response, await response.text());

延迟处理器

import { H3, defineLazyEventHandler, serve } from "h3";

function delay(ms) {
  return new Promise((resolve) => setTimeout(resolve, ms));
}

const app = new H3();

const handler = defineLazyEventHandler(async () => {
  // 这里可以做一些初始化操作
  return async (event) => {
    await delay(10000); // 延迟1秒
    return "Hello H3! (Lazy)";
  };
});

app.get("/lazy-delay", handler);

serve(app, { port: 3000 });

fromWebHandler、fromNodeHandler

fromWebHandler、fromWebHandler 是 h3 提供的一个工具，可以把标准 Web API 风格的 handler（如 Express、原生 Node.js handler）适配为 H3 的 handler。

fromWebHandler

import { H3, fromWebHandler, serve } from "h3";

const app = new H3();

const myWebHandler = (request) => new Response("Hello from WebHandler!");

// 使用 fromWebHandler 工具
app.get("/web", fromWebHandler(myWebHandler));

serve(app, { port: 3000 });

fromNodeHandler

import { H3, fromNodeHandler } from "h3";
import { serve } from "h3/node";

export const app = new H3();

const nodeHandler = (req, res) => {
  res.end("Hello from nodeHandler!");
};

app.get("/web", fromNodeHandler(nodeHandler));

serve(app, { port: 3000 });