Socket.io赢得'；t连接next.js环境变量

我有一个工作环境变量设置，但socketio不会连接它

在.env.local中，我有：

HOST=http://localhost:8080

然后在index.js中：

console.log(process.env.HOST)    
const socket = io(process.env.HOST)

它打印本地主机，但不会连接。我也尝试过用引号将链接括起来，但这不起作用

只有这种配置有效

const socket = io('https://localhost:8080')

---

您是否在客户端代码中使用该代码？如果是，这就是问题所在：

默认情况下，nextjs使环境变量仅在服务器端环境中可用（因此您不会意外地向客户端公开机密）。 为了向客户端公开某些变量，您必须在它们前面加上

NEXT\u PUBLIC\u

，如下所示：

NEXT_PUBLIC_HOST=http://localhost:8080

及

---

谢谢，这很有效。你能解释一下我为什么需要这个吗？const socket=io（…）在javascript中，这让我觉得它在node.js环境中，而不是浏览器端的一部分。虽然nextjs在服务器上呈现页面，但它会在客户端上“水合物化”应用程序，以提供页面交互性。这意味着react代码首先在服务器上运行，然后在客户端上运行。某些事情，如“getStaticProps”中的数据获取或API路由只在服务器上运行，因此您可以在那里安全地使用秘密环境变量，而无需为它们添加前缀。由于nextjs使服务器和客户机代码位于同一文件中，因此强制为公共变量添加前缀有助于防止您意外地向客户机泄露机密。

console.log(process.env.NEXT_PUBLIC_HOST)    
const socket = io(process.env.NEXT_PUBLIC_HOST)