我正在学习NextJS,并试图确定如何用一个干净、安全的体系 struct 来布局我的项目.但是,我不确定在哪里存储包含潜在敏感数据的代码(即连接到数据库、访问文件系统等).我读过文件,但我仍然不确定这一问题.

在我的项目布局中,我有两个与这个问题相关的目录:我添加的顶级/lib目录和每个NextJS项目中烘焙的/pages/api目录.

据我所知,/pages/api从未见过客户端,因此对于敏感代码是安全的.它只能用作发布、修补、删除等操作的地方.例如,当您从表单向服务器发出post请求时,使用/pages/api.您可以从任何地方通过该路径调用api,例如:表单组件、/lib文件夹、/pages中的页面、外部第三方api——无论在哪里.

另一方面,顶级/lib目录是一个存放样板代码的地方,执行繁琐的操作,如按字母顺序排序博客帖子、进行数学计算等.这不一定是"机密"或敏感的——只是冗长而烦人的代码./lib目录将始终被客户端even if it's code that's only called by a server-side method such as 102看到.

简而言之,任何远程敏感的代码都应该作为post、补丁、put等请求发送到/pages/api目录,任何不敏感的长代码/冗长代码都应该重构到/lib目录.

我有这个吗?

推荐答案

你可以在api路由中做一些敏感的事情,getServerSidePropsgetStaticProps.除非您的页面实际从那里导入代码,否则客户端不会看到/lib中的任何代码.

因为你说的是数据库连接,所以你不太可能意外地从浏览器连接到数据库.几乎没有一个用于连接到db的库在浏览器中无法工作,而且您也只能在客户端访问以NEXT_PUBLIC_开头的env变量.

您还需要记住,/api以下的每个文件都将是一个api路由,因此您应该将助手文件放在/lib而不是/api内.如果将其置于/api以下,则可能会导致安全漏洞,因为任何人都可以触发/api以下文件的默认导出功能.

如果您出于某种原因需要绝对确定某些代码没有绑定到客户端将加载的文件中,即使您无意中导入了这些代码,也可以使用自定义webpack配置来完成.请注意,只有当代码本身非常敏感时,我才会研究这个选项.因为如果有人能读懂代码就会导致后果.不要说代码执行db查询或类似的操作,即使您意外地将它们导入到客户机包中,也不会造成任何威胁,因为客户机无法连接到您的数据库.

Javascript相关问答推荐

如何用显示网格平滑地将元素从一个地方移动到另一个地方?

useNavigation更改URL,但不呈现或显示组件

防止用户在selectizeInput中取消 Select 选项

Promise Chain中的第二个useState不更新

数字时钟在JavaScript中不动态更新

用于编辑CSS样式的Java脚本

在JS中拖放:检测文件

为什么我的导航条打开状态没有在窗口addeventlistener(Reaction Js)中更新?

IF语句的计算结果与实际情况相反

映射类型定义,其中值对应于键

自定义图表工具提示以仅显示Y值

第一项杀死下一项,直到数组长度在javascript中等于1

警告框不显示包含HTML输入字段的总和

在表单集中保存更改时删除';禁用';

如何通过Axios在GraphQL查询中发送数组

是否可以在不更改组件标识的情况下换出Reaction组件定义(以维护状态/引用等)?如果是这样的话,是如何做到的呢?

Reaction useState和useLoaderData的组合使用引发无限循环错误

FindByIdAndUpdate在嵌套对象中创建_id

在对象的嵌套数组中添加两个属性

在AgGrid中显示分组行的单元格值