javascript - 混音 : middleware pattern to run code before loader on every request?

Question

Remix 中是否有推荐的模式用于在每个请求上运行通用代码，并可能将上下文数据添加到请求中？像中间件？例如，一个用例可能是进行日志记录或身份验证。
我见过的与此相似的一件事是 loader context通过 getLoadContext API。这使您可以填充 context作为参数传递给所有路由加载器的对象。
它确实有效，最初似乎是这样做的方法，但是 the docs因为它说...

It's a way to bridge the gap between the adapter's request/response API with your Remix app

This API is an escape hatch, it’s uncommon to need it

...这让我不这么认为，因为

此 API 明确用于与服务器运行时的自定义集成。但似乎中间件不应该特定于服务器运行时——它们应该只是作为 Remix 功能的“应用程序”级别的一部分。

运行中间件是 Web 框架中非常常见的模式!

那么，对于在每个加载器之前运行的中间件，Remix 是否有更好的模式？

Answer 1

代替中间件，您可以直接在加载器内部调用函数，这也将更加明确。如果您想尽早从那些“中间件”返回响应，Remix 让您抛出响应对象。
例如，如果您想检查用户是否具有特定 Angular 色，您可以创建此函数:

async function verifyUserRole(request: Request, expectedRole: string) {
  let user = await getAuthenticatedUser(request); // somehow get the user
  if (user.role === expectedRole) return user;
  throw json({ message: "Forbidden" }, { status: 403 });
}

在任何加载器中都这样调用它:

let loader: LoaderFunction = async ({ request }) => {
  let user = await verifyUserRole(request, "admin");
  // code here will only run if user is an admin
  // and you'll also get the user object at the same time
};

另一个例子可能是要求 HTTPS

function requireHTTPS(request: Request) {
  let url = new URL(request.url);
  if (url.protocol === "https:") return;
  url.protocol = "https:";
  throw redirect(url.toString());
}

let loader: LoaderFunction = async ({ request }) => {
  await requireHTTPS(request);
  // run your loader (or action) code here
};