文档中心

探索 DWeb 框架的无限可能，构建下一代高性能 Web 应用

创建自定义插件

你可以创建自己的插件来扩展框架功能。

基本结构

插件是一个对象，包含 name 和生命周期钩子：

Code
import type { Plugin } from "@dreamer/dweb";

const myPlugin: Plugin = {
  name: "my-plugin",
  onInit: async (app) => {
    // 插件初始化
    console.log("Plugin initialized");
  },
  onRequest: async (req, res) => {
    // 每个请求前执行
    console.log("Request:", req.url);
  },
  onResponse: async (req, res, html) => {
    // 每个响应后执行，可以修改 HTML
    return html;
  },
  onError: async (error, req, res) => {
    // 发生错误时执行
    console.error("Error:", error);
  },
  onBuild: async (config) => {
    // 构建时执行
    console.log("Build config:", config);
  },
};

app.plugin(myPlugin);

插件示例

简单插件

Code
import type { Plugin } from "@dreamer/dweb";

const helloPlugin: Plugin = {
  name: "hello",
  onResponse: async (req, res, html) => {
    // 在 HTML 中注入脚本
    return html.replace(
      '</body>',
      '<script>console.log("Hello from plugin!")</script></body>'
    );
  },
};

app.plugin(helloPlugin);

配置化插件

Code
import type { Plugin } from "@dreamer/dweb";

interface MyPluginOptions {
  prefix: string;
  enabled: boolean;
}

function createMyPlugin(options: MyPluginOptions): Plugin {
  return {
    name: "my-plugin",
    onInit: async (app) => {
      if (!options.enabled) {
        return;
      }
      console.log("Plugin prefix:", options.prefix);
    },
    onRequest: async (req, res) => {
      if (options.enabled) {
        res.setHeader("X-Prefix", options.prefix);
      }
    },
  };
}

app.plugin(createMyPlugin({
  prefix: "api",
  enabled: true,
}));

异步插件

Code
import type { Plugin } from "@dreamer/dweb";

const asyncPlugin: Plugin = {
  name: "async-plugin",
  onInit: async (app) => {
    // 异步初始化
    const config = await fetch("/api/config").then(r => r.json());
    console.log("Plugin config loaded:", config);
  },
  onRequest: async (req, res) => {
    // 使用配置
    const config = await getConfig();
    (req as any).pluginConfig = config;
  },
};

app.plugin(asyncPlugin);

带清理的插件

Code
import type { Plugin } from "@dreamer/dweb";

let intervalId: number | null = null;

const cleanupPlugin: Plugin = {
  name: "cleanup-plugin",
  onInit: async (app) => {
    // 设置定时任务
    intervalId = setInterval(() => {
      console.log("定时任务执行");
    }, 1000);
  },
  onBuild: async (config) => {
    // 清理资源
    if (intervalId !== null) {
      clearInterval(intervalId);
      intervalId = null;
    }
  },
};

app.plugin(cleanupPlugin);

处理 API 请求的插件

Code
import type { Plugin } from "@dreamer/dweb";

const apiPlugin: Plugin = {
  name: "api-plugin",
  onRequest: async (req, res) => {
    // 处理特定的 API 路由
    if (req.url.startsWith("/api/plugin")) {
      res.json({ message: "Hello from plugin API" });
      return; // 提前返回，不继续处理
    }
  },
};

app.plugin(apiPlugin);

API 参考

Plugin 接口

Code
interface Plugin {
  name: string;
  onInit?: (app: AppLike) => Promise<void> | void;
  onRequest?: (req: Request, res: Response) => Promise<void> | void;
  onResponse?: (req: Request, res: Response, html: string) => Promise<string> | string;
  onError?: (error: Error, req: Request, res: Response) => Promise<void> | void;
  onBuild?: (config: AppConfig) => Promise<void> | void;
}

使用插件

Code
// 在 Application 上使用
app.plugin(plugin);

// 在配置文件中使用
export default {
  plugins: [
    myPlugin(),
  ],
};

相关文档