前端全栈混合之路Deno篇：Deno2.0如何快速创建http一个 restfulapi/静态文件托管应用及oak框架介绍

前端全栈混合之路Deno篇：如何快速创建一个 restful-http服务应用及oak框架介绍

1. Deno简介

Deno 是由 Node.js 的创始人 Ryan Dahl 开发的一个全新的 JavaScript 和 TypeScript 运行时。Deno 旨在解决 Node.js 中的一些设计缺陷，并且具有更强的安全性、更简单的模块系统、内置的 TypeScript 支持等特点。Deno 默认以更加安全的方式运行代码，使用权限机制来限制对文件系统、网络和环境的访问。

Deno 提供了一些简单而强大的 API 来创建 HTTP 服务器，并且有像 Oak (Koa变体）这样的优秀框架来加速开发。本文将介绍如何使用 Deno 快速创建一个 RESTful HTTP 服务应用，同时介绍 Oak 框架的基本功能和使用方法。

2. Deno.serve

Deno 通过内置的 Deno.serve API 提供了一种非常简单的方式来创建 HTTP 服务。下面我们来看看如何安装 Deno，并使用 Deno.serve 创建一个简单的 HTTP 服务。

对于简单的服务，使用这个标准接口是完全够用的，尤其是微服务的场景下，前后端的接口都是一致的。

2.1 使用

安装完成后，我们可以使用 Deno.serve 快速启动一个 HTTP 服务。以下是一个简单的示例：

简单运行：

ts 复制代码

const handler = (req: Request): Response => {
  const data = req.json() // 读取数据也是很简单的，和前端fetch的response基本一致
  return new Response("Hello, Deno!");
};

Deno.serve(handler);

配置项：

typescript 复制代码

Deno.serve({
    port: 8000,
    handler: (req) => {
        req.respond({
            body: "Hello World",
        });
    },
})

将以上代码保存为 server.ts 文件，然后通过以下命令运行：

sh 复制代码

deno run --allow-net server.ts

这个代码段通过 Deno.serve 启动了一个 HTTP 服务，并在根路径下返回 "Hello, Deno!"。--allow-net 参数用于允许程序进行网络操作。

下面介绍两个场景的http服务扩展：静态文件+理由，详细的使用参考 deno-std-http标准库

2.2 扩展1- 静态文件服务

直接使用标准库提供的静态文件服务

bash 复制代码

deno run --allow-net --allow-read jsr:@std/http/file-server
Listening on:
- Local: http://localhost:8000

这样，我们就可以在浏览器中访问指定路径下的文件。

2.3 扩展2- 路由

与其它的路由不同之处在于，它是紧跟前端的规范 UrlPattern规范

typescript 复制代码

import { route, type Route } from "@std/http/unstable-route";
import { serveDir } from "@std/http/file-server";

const routes: Route[] = [
  {
    pattern: new URLPattern({ pathname: "/about" }),
    handler: () => new Response("About page"),
  },
  {
    pattern: new URLPattern({ pathname: "/users/:id" }),
    handler: (_req, _info, params) => new Response(params?.pathname.groups.id),
  },
  {
    pattern: new URLPattern({ pathname: "/static/*" }),
    handler: (req: Request) => serveDir(req)
  },
  {
    method: ["GET", "HEAD"],
    pattern: new URLPattern({ pathname: "/api" }),
    handler: (req: Request) => new Response(req.method === 'HEAD' ? null : 'ok'),
  },
];

function defaultHandler(_req: Request) {
  return new Response("Not found", { status: 404 });
}

Deno.serve(route(routes, defaultHandler));

3. oak框架

虽然 Deno.serve 很简单易用，但对于复杂的应用程序来说，可能需要一个更高级的框架。Oak 是 Deno 上一个非常流行的 HTTP 中间件框架，类似于 Node.js 中的 Express，帮助开发者更高效地构建 RESTful API。

框架的运行时支持情况：Deno/Bun/Nodejs

3.1 安装

Oak 可以通过 Deno 的 URL 导入机制来安装和使用。可以通过以下方式导入 Oak：

ts 复制代码

import * as mod from "jsr:@oak/oak";

或者安装

bash 复制代码

deno add jsr:@oak/oak

3.2 使用

以下是使用 Oak 创建一个简单的 HTTP 服务的示例：

ts 复制代码

import { Application } from "jsr:@oak/oak/application";

const app = new Application();

app.use(async (ctx,next) => {
  ctx.response.body = "Hello, Oak!";
});

await app.listen({ port: 8000 });

这个代码段创建了一个新的 Oak 应用程序，并通过 app.listen 方法在 8000 端口启动了服务器。在浏览器中访问 http://localhost:8000，可以看到返回的 "Hello, Oak!"。

3.3 中间件

Oak 的核心特性之一是中间件 - 因为参考Koa，所以也是洋葱模式，也就是一个中间件搞定请求的前置和后处理。中间件是一个函数，可以对请求和响应进行处理。下面是一个使用中间件的示例：

ts 复制代码

import { Application } from "https://deno.land/x/oak/mod.ts";

const app = new Application();

app.use(async (ctx, next) => {
  console.log(`Request: ${ctx.request.method} ${ctx.request.url}`);
  //   和Koa保持高度一致
  await next();
  console.log(`Response: ${ctx.response.status}`);
});

app.use((ctx) => {
  ctx.response.body = "Hello, Middleware!";
});

await app.listen({ port: 8000 });

这个例子中的中间件会在每个请求到达时记录请求的方法和 URL，并在响应后记录响应的状态码。

3.4 路由

Oak 提供了路由功能，使得处理不同 URL 的请求变得简单。可以通过 Router 类来实现路由：

ts 复制代码

import { Application } from "jsr:@oak/oak/application";
import { Router } from "jsr:@oak/oak/router";

const app = new Application();
const router = new Router();

router
  .get("/", (ctx) => {
    ctx.response.body = "Welcome to Oak Router!";
  })
  .get("/users", (ctx) => {
    ctx.response.body = "User list.";
  })
  .post("/users", (ctx) => {
    ctx.response.body = "Create a new user.";
  });

app.use(router.routes());
app.use(router.allowedMethods());

await app.listen({ port: 8000 });

在这个示例中，我们创建了一个新的路由器，并为不同的路径和方法定义了处理函数。最后，我们将路由器挂载到应用程序上。

3.5 静态文件服务

Oak 还可以用于提供静态文件服务。可以使用 send 方法来处理静态文件请求：

ts 复制代码

import { send } from "jsr:@oak/oak/send";
import { Application } from "jsr:@oak/oak/application";

const app = new Application();

app.use(async (ctx) => {
  await send(ctx, ctx.request.url.pathname, {
    root: `${Deno.cwd()}/public`,
  });
});

await app.listen({ port: 8000 });

这个示例会从 public 目录中提供静态文件，例如 HTML、CSS 和 JavaScript 文件。通过这种方式，可以轻松地构建一个静态网站或提供文件下载服务。

总结

本文介绍了如何使用 Deno 内置的 Deno.serve 快速创建一个 HTTP 服务，并且介绍了 Oak 框架的安装和使用方法，包括中间件、路由和静态文件服务等功能。Deno 和 Oak 结合使得在前端全栈开发中创建 RESTful API 变得高效且简便，非常适合快速开发和部署现代 Web 应用程序。希望本文对您了解和使用 Deno 及 Oak 框架有所帮助。

我个人是推荐用标准库的内容的，尤其是微服务开发情况下，这时候一个接口的服务很小，没必要搞一个框架。如果是单体应用，还是可以用oak来简化维护的。下个章节，我将介绍deno2.0如何搭建websocket应用