javascript - nextjs的 route handler 到底有什么用？

Question

route handler 定义在 route.ts/js 文件里， 看上去和 page 的定义非常像，无非就是 page 返回的是页面内容，route.ts 更多的像是一个restful风格的返回值，尽管他也能通过 reponse 直接返回 html 标签，但是相信应该不会这样做。
所以我的疑问是，这个到底是干嘛用的？服务器组件里我能直接 fetch 更后端的接口获取数据，客户端也可以吧？
我在介绍 fetch data的文档里，看到可以在客户端组件里通过route handler 请求数据，那么请求的链路等于是客户端组件，通过/api/xxx 请求 route.ts, 然后 route.ts 里也许去访问数据库或者请求后端接口再去调用一下，那么为什么不直接在客户端组件里请求后端接口。经过这个中转不是多次一举吗？除非后端逻辑就在route.ts
新手刚接触，有点疑问，谢谢指点

Answer 1

Next.js 现在早就已经不是原来的单纯的 SSG/SSR 框架了，新版本里越来越多的特性是在往全栈的方向发展 —— 这也是它背后的 Vercel 公司所期望的，人家卖的就是基于此的云服务，恨不得你把所有业务全都在 Next.js 里写，这样它才好卖产品。

所以不要想太复杂，这玩意儿实质就是在服务端运行的。如果你只需要 SSG/SSR 的部分，那确实它没啥用，你理解的“多次一举”是对的。

P.S. 之前的版本里已经有类似的特性了，即 API Routes。不过用法上有很多限制。Route Handlers 相当于超进化版的 API Routes。

Answer 2

Next.js 的路由处理器（Route Handler）主要用于处理 API 路由请求，这些请求通常返回 JSON 数据，而不是 HTML 页面。这是 RESTful API 的常见做法，API 返回的数据可以被前端页面或其他客户端应用程序使用。

在 Next.js 中，你可以使用路由处理器来处理如 /api/data 这样的请求，然后在路由处理器中执行一些后端逻辑，比如访问数据库或调用其他后端服务。一旦这些逻辑执行完成，你就可以返回相应的 JSON 数据。

路由处理器和页面（Page）之间的主要区别在于，页面主要用于返回 HTML 内容，而路由处理器主要用于返回 JSON 数据。这使得路由处理器成为处理 API 请求的理想选择。

至于你提到的在客户端组件中直接请求后端接口与通过路由处理器请求数据的区别，主要有以下几点：

1. 代码组织和结构：使用路由处理器可以将后端逻辑从客户端组件中分离出来，使得代码更加清晰和易于维护。
2. 权限和身份验证：在路由处理器中，你可以更方便地实现权限控制和身份验证逻辑，确保只有经过授权的请求才能访问特定数据。
3. 错误处理：路由处理器还可以方便地处理错误和异常，确保返回给客户端的是统一的错误格式和处理方式。
4. 数据缓存：在某些情况下，你可能希望在路由处理器中实现数据缓存，以减少对后端服务的请求次数。

总的来说，尽管你可以在客户端组件中直接请求后端接口获取数据，但在 Next.js 中使用路由处理器来处理 API 请求可以提供更多的灵活性和功能。当然，具体选择哪种方式取决于你的项目需求和个人偏好。