我正在使用Storyblok构建博客（v2）和Next.js（v13）.我知道NEXT_PUBLIC环境变量可以暴露给浏览器，我不希望我的访问令牌暴露。我过去在组件文件中使用API文件夹来实现这一点，但我不认为我可以将其用于页面文件-除非我错了。我已经阅读了Next.js的文档，我对如何在_app.js文件中实现这一点感到困惑。我仍在学习如何使用Next.js正确隐藏这些内容，并且在之前的尝试中取得了成功。
这是我在寻找答案后到目前为止所做的尝试。我已经将我的访问令牌添加到项目根目录中的.env文件中。我没有使用NEXT_PUBLIC。我之所以没有使用它，是因为在我的另一个项目中，我能够在浏览器中隐藏我的环境变量，我就是这么做的。我还根据我在搜索中找到的信息将它添加到我的next.config.js文件中。这是该文件的外观：

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  env: { ACCESS_TOKEN: process.env.ACCESS_TOKEN },
}

module.exports = nextConfig

我的_app.js文件看起来像这样：

import { storyblokInit, apiPlugin } from '@storyblok/react'
import '../styles/globals.css'

storyblokInit({
  accessToken: process.env.ACCESS_TOKEN,
  use: [apiPlugin],
});

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

export default MyApp

当然，上面的方法不起作用。当我将{process.env.ACCESS_TOKEN}添加到任何页面时，它都会显示令牌。根据我阅读的文档，我理解为什么这不起作用，但我只是想在这里发布我的问题之前尝试所有可能的方法。
在做这些事情之前，我还尝试将变量添加到项目根目录下的.env文件中（不使用NEXT_PUBLIC前缀），然后在_app.js文件中，我有以下内容：

import { storyblokInit, apiPlugin } from '@storyblok/react'
import '../styles/globals.css'

storyblokInit({
  accessToken: token,
  use: [apiPlugin],
});

function MyApp({ Component, pageProps }) {
  return <Component {...pageProps} />
}

export default MyApp

function getStaticProps() {
  return {
    props: {
      token: props.env.ACCESS_TOKEN
    }
  }
}

我的next.config.js文件没有被触及，所以它不包含env在它。我得到的错误是令牌未定义。This文章是我找到我尝试的步骤的地方。
在那之后，我开始使用试错法，主要是因为我掉进了谷歌的兔子洞，非常沮丧。

import { storyblokInit, apiPlugin } from '@storyblok/react'
import '../styles/globals.css'

function MyApp({ Component, pageProps, props }) {
  storyblokInit({
    accessToken: props.token,
    use: [apiPlugin],
  });

  return <Component {...pageProps} />
}

export default MyApp

function getStaticProps() {
  return {
    props: {
      token: props.env.ACCESS_TOKEN
    }
  }
}

我在这里得到的错误是：Cannot read properties of undefined (reading 'token')
在_app.js文件中，我试图做的事情是否可能？我很乐意阅读任何其他文档，如果这是对我的问题的更好回答，我可能在我的搜索中没有找到。