next.js 将env变量(来自getServerSideProps)作为属性传递给另一个组件是否安全?

ewm0tg9j  于 2022-12-12  发布在  其他
关注(0)|答案(2)|浏览(185)

将env变量(来自getServerSideProps)作为属性传递给另一个组件是否安全?
我希望在客户端使用此env变量,但我希望确保它对客户端保持不可见

const Home: NextPage = (props:any) => {
  return (      
    <HomeView priv={props.priv} />  
  );
};

export default Home;
export async function getServerSideProps() {
  return {props:{priv:process.env.PRIVATE_KEY}}
}

我使用了getServerSideProps,但env变量出现在网络选项卡中。我该怎么办?前端托管在Vercel上。

igetnqfo

igetnqfo1#

是的,将env变量作为属性从getServerSideProps传递给另一个组件是安全的。之所以安全,是因为env变量安全地存储在服务器上,无法从客户端访问。这意味着数据不会暴露给潜在的恶意参与者,从而确保数据保持安全。
如果您要在客户端使用env变数,但对客户端保持不可见,则可以使用服务器端环境变数储存区(例如dotenv或Vault)来安全地储存变数,并在服务器端存取它。这将防止变数暴露给客户端。
您还可以使用Node.js全局对象process.env来安全地存储环境变量并在服务器端访问它们。例如:

// server-side
const MY_SECRET_VARIABLE = process.env.MY_SECRET_VARIABLE;
// client-side
const MY_SECRET_VARIABLE = null;
qnakjoqk

qnakjoqk2#

环境机密(如私钥)根本不应传递给客户端。相反,您应该在API函数或getServerSideProps中的服务器端使用它们。
如果你有一个不是secret的环境变量,或者是第三方脚本(如analytics)所需要的环境变量,你可以使用NEXT_PUBLIC_前缀。

相关问题